Reputation: 267
In the following code I am trying to select events from a table in a database to show it in the open source calendar Fullcalendar.io
public JsonResult GetEvents()
{
using (var db = new MyDatabaseEntities())
{
var select = from cevent in db.EventTables
select new {
id = cevent.Id,
start = cevent.Start_Time,
end = cevent.End_Time
};
var rows = select.ToArray();
return Json(rows, JsonRequestBehavior.AllowGet);
}
}
The thing is that i use the events as follow to fetch the data as described in documentation:
events: function () {
$.ajax({
url: 'GetEvents',
type: 'GET',
success: function (result) {
console.log(result);
},
error: function (result) {
console.log("data is not fetshed from database");
}
});
},
and when looking in the console at the browser following picture is the result:
And thats how start and end time are saved in db
the start and end date format are wrong and I am not able to fix it, can anyone help please.
Upvotes: 1
Views: 489
Reputation: 352
You need to return the date in an ISO8601 date string for start and end params. As stated on http://fullcalendar.io/docs/event_data/startParam/
The code should be:
public JsonResult GetEvents()
{
using (var db = new MyDatabaseEntities())
{
var events = from cevent in db.EventTables
select cevent;
var rows = events.ToList().Select(cevent => new {
id = cevent.Id,
start = cevent.Start_Time.AddSeconds(1).ToString("yyyy-MM-ddTHH:mm:ssZ"),
end = cevent.End_Time.ToString("yyyy-MM-ddTHH:mm:ssZ")
}).ToArray();
return Json(rows, JsonRequestBehavior.AllowGet);
}
}
I recommend adding 1 second to the start time, to avoid conflicts on events like: Event1 10:00 to 11:00 Event2 11:00 to 11:30
For fullcalendar.io Event2 is overlaping with Event1, becuase of the last second of Even1 and the first second of Event2.
Upvotes: 2