Hi All.
I Have search for a solution to this, but can't find any, so hope someone here can help.
I have found a FullCalendar jQuery ex. with JSON http://simpledotnetsolutions.wordpress.com/2012/08/14/exploring-jquery-plugin-fullcalendar/
but the først ex. i can't get it to my page, it's just load and then show a blank page. I have tryed debug, but get no results.
Can someone see whats the problem and why im getting a blank/empty page !?
Main_code
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="default.aspx.vb" Inherits="_default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link href="css/fullcalendar.css" rel="stylesheet" />
<link href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/themes/redmond/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="js/fullcalendar.min.js"></script>
<script src="https://github.com/douglascrockford/JSON-js/raw/master/json2.js" type="text/javascript"></script>
<script src="js/jquery-ui-timepicker-addon-1.0.5.js"></script>
<script src="js/jquery.qtip-1.0.0-rc3.min.js"></script>
<script type="text/javascript">
function UpdateMyEvent(event) {
var eventToSave = new Object();;
eventToSave.EventID = event.id;
eventToSave.StartDate = event.start.toLocaleString();
eventToSave.EndDate = event.end.toLocaleString();
eventToSave.EventName = event.title;
$.ajax({
type: "POST",
contentType: "application/json",
data: "{eventdata1:" + JSON.stringify(eventToSave) + "}",
url: "default.aspx/UpdateEvent",
dataType: "json",
error: function (XMLHttpRequest, textStatus, errorThrown) {
debugger;
}
});
}
$(document).ready(function () {
DisplayCalendar();
});
function DisplayCalendar() {
$.ajax({
type: "POST",
contentType: "application/json",
data: "{}",
url: "default.aspx/GetEvents",
dataType: "json",
success: function (data) {
$('div[id*=calendar]').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
selectable: true,
editable: true,
droppable: true,
draggable: true,
selectable: true,
selectHelper: true,
eventTextColor: 'Yellow',
eventBackgroundColor: 'purple',
events:
$.map(data.d, function (item, i) {
var event = new Object();
event.id = item.EventID;
event.start = item.StartDate;
event.end = item.EndDate;
event.title = item.EventName;
event.allDay = false;
if (event.title == 'Event_1') {
event.color = "DarkBlue";
event.textColor = "DarkBlue";
event.backgroundColor = "yellow";
event.title = "Important Meeting";
}
return event;
}),
eventRender: function (event, element) {
element.attr("categories", event.categoryname),
element.qtip({
content: event.title + "<br>" + event.start,
position: { corner: { tooltip: 'bottomLeft', target: 'topRight' } },
style: {
border: {
width: 1,
radius: 3,
color: 'green'
},
padding: 10,
textAlign: 'left',
tip: true
}
});
},
eventAfterRender: function (event, element, view) {
},
eventResize: function (event, dayDelta, minuteDelta, revertFunc) {
if ($(this).data("qtip")) $(this).qtip("destroy");
if (!confirm("is this okay?")) {
revertFunc();
}
else {
UpdateMyEvent(event);
}
},
eventDrop: function (event, dayDelta, minuteDelta, allDay, revertFunc) {
if ($(this).data("qtip")) $(this).qtip("destroy");
}
});
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
debugger;
}
});
}
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="SMjquery" runat="server">
<Scripts>
<asp:ScriptReference Name="jquery"/>
<asp:ScriptReference Name="jquery-UI"/>
</Scripts>
</asp:ScriptManager>
http://simpledotnetsolutions.wordpress.com/2012/08/14/exploring-jquery-plugin-fullcalendar/
<br /><br />
<div id='calendar'></div>
</form>
</body>
</html>
Code_Behind
Imports System
Imports System.Configuration
Imports System.Data
Imports System.Linq
Imports System.Web
Imports System.Web.Security
Imports System.Web.UI
Imports System.Web.UI.HtmlControls
Imports System.Web.UI.WebControls
Imports System.Web.UI.WebControls.WebParts
Imports System.Xml.Linq
Imports System.Collections.Generic
Partial Public Class _default
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
If Not IsPostBack Then
End If
End Sub
<System.Web.Services.WebMethod> _
Public Shared Function GetEvents() As List(Of [Event])
Dim events As List(Of [Event])
If HttpContext.Current.Session("events") IsNot Nothing Then
events = DirectCast(HttpContext.Current.Session("events"), List(Of [Event]))
Else
events = New List(Of [Event])()
events.Add(New [Event]() With { _
.EventID = 1, _
.EventName = "Event_1", _
.StartDate = DateTime.Now.ToString("MM-dd-yyyy"), _
.EndDate = DateTime.Now.AddDays(2).ToString("MM-dd-yyyy") _
})
events.Add(New [Event]() With { _
.EventID = 2, _
.EventName = "Event_2", _
.StartDate = DateTime.Now.AddDays(4).ToString("MM-dd-yyyy"), _
.EndDate = DateTime.Now.AddDays(5).ToString("MM-dd-yyyy") _
})
events.Add(New [Event]() With { _
.EventID = 3, _
.EventName = "Event_3", _
.StartDate = DateTime.Now.AddDays(10).ToString("MM-dd-yyyy"), _
.EndDate = DateTime.Now.AddDays(11).ToString("MM-dd-yyyy") _
})
events.Add(New [Event]() With { _
.EventID = 4, _
.EventName = "Event_4", _
.StartDate = DateTime.Now.AddDays(22).ToString("MM-dd-yyyy"), _
.EndDate = DateTime.Now.AddDays(25).ToString("MM-dd-yyyy") _
})
End If
HttpContext.Current.Session("events") = events
Return events
End Function
<System.Web.Services.WebMethod> _
Public Shared Function UpdateEvent(eventdata1 As [Event]) As Boolean
Dim events As List(Of [Event])
If HttpContext.Current.Session("events") IsNot Nothing Then
events = DirectCast(HttpContext.Current.Session("events"), List(Of [Event]))
Else
events = New List(Of [Event])()
End If
If events.Contains(eventdata1) Then
Dim _MyEvent As [Event] = events.Find(Function(bk As [Event]) bk.EventID = eventdata1.EventID)
If TypeOf _MyEvent Is Object Then
_MyEvent.StartDate = eventdata1.StartDate
_MyEvent.EndDate = eventdata1.EndDate
End If
End If
HttpContext.Current.Session("events") = events
Return True
End Function
End Class
Event.vb
Imports Microsoft.VisualBasic
Public Class [Event]
Public Property EventID() As System.Nullable(Of Integer)
Get
Return m_EventID
End Get
Set(value As System.Nullable(Of Integer))
m_EventID = Value
End Set
End Property
Private m_EventID As System.Nullable(Of Integer)
Public Property EventName() As String
Get
Return m_EventName
End Get
Set(value As String)
m_EventName = Value
End Set
End Property
Private m_EventName As String
Public Property StartDate() As String
Get
Return m_StartDate
End Get
Set(value As String)
m_StartDate = Value
End Set
End Property
Private m_StartDate As String
Public Property EndDate() As String
Get
Return m_EndDate
End Get
Set(value As String)
m_EndDate = Value
End Set
End Property
Private m_EndDate As String
End Class