I am using FullCalendar
in my asp.net mvc application. It does not load events. I am getting event list by ajax call. Below is my code. What is wrong with it.?
<div class="row">
<div class="col-lg-12">
<section class="panel">
<div class="panel-body">
<div id="calendar"></div>
</div>
</section>
</div>
</div>
<script type="text/javascript">
jQuery.extend({
getValues: function (url) {
var result = null;
$.ajax({
url: url,
type: 'get',
dataType: 'json',
async: false,
success: function (data) {
result = data;
},
error: function (err) {
alert(JSON.stringify(err));
}
});
return result;
}
});
var jsonEvents = $.getValues('@Url.Action("GetEvents", "Booking")');
alert(jsonEvents);
//var jsonEvents = [{ title: "Dhaval, (4,6), 6", start: "05/21/2016 1:05:00 PM" },
// { title: "Mohit, (2), 4", start: "05/21/2016 1:05:00 PM" }]
$('#calendar').fullCalendar({
header:
{
left: 'prev,next today',
center: 'title',
right: 'agendaWeek,agendaDay'
},
allDay: true,
defaultView: 'agendaWeek',
events: jsonEvents//'@Url.Action("GetEvents", "Booking")'
});
</script>
**the js in comment is just for example format. ** And the GetEvents/Controller
is as below,
public Json GetEvents()
{
string query = "query to get events";
// columns in result table are: id, title, date
try
{
SqlConnection connection = new SqlConnection("connectionString");
connection.Open();
SqlCommand command = new SqlCommand(query, connection);
SqlDataReader events = command.ExecuteReader();
DataTable dt = new DataTable();
dt.Load(events);
string result = DataTableToJSONWithStringBuilder(dt);
connection.Close();
return Json(result, JsonRequestBehavior.AllowGet);
}
catch (Exception ex) { }
}
public string DataTableToJSONWithStringBuilder(DataTable table)
{
var JSONString = new StringBuilder();
if (table.Rows.Count > 0)
{
JSONString.Append("[");
for (int i = 0; i < table.Rows.Count; i++)
{
JSONString.Append("{");
for (int j = 0; j < table.Columns.Count; j++)
{
if (j < table.Columns.Count - 1)
{
JSONString.Append(table.Columns[j].ColumnName.ToString() + ":" + "\"" + table.Rows[i][j].ToString() + "\",");
}
else if (j == table.Columns.Count - 1)
{
JSONString.Append(table.Columns[j].ColumnName.ToString() + ":" + "\"" + table.Rows[i][j].ToString() + "\"");
}
}
if (i == table.Rows.Count - 1)
{
JSONString.Append("}");
}
else
{
JSONString.Append("},");
}
}
JSONString.Append("]");
}
return JSONString.ToString();
}
This is the format I want. [{title:"John, (2,1), 6",start:"13/05/2016 12:00:00 AM"},{title:"Olivia, (11,4), 6",start:"11/05/2016 12:00:00 AM"}]
Getting following error when inspect element. :
Failed to load resource: the server responded with a status of 400 (Bad Request) : http: localho../ABC/[%7Btitle:%22John,%20(4,6),%206%22,start:%2205/21/2016%201:05:00%20PM%22,end:%2205/21/2016%201:30:00%20PM%22%7D,%7Btitle:%22Olivia,%20(2),%204%22,start:%2205/21/2016%201:05:00%20PM%22,end:%2205/21/2016%201:30:00%20PM%22%7D]?start=2016-05-15&end=2016-05-22&_=1463885539445
here I have commented var jsonEvents = [...]
. When I use predefined events, the calendar shows them perfect. But when I call to server, there is error.
DOES FULLCALENDAR ONLY SHOWS THE EVENTS FROM A FILE STORED ON THE SERVER. BECAUSE THE DOCUMENTATION SHOWS ONLY URL TO A FILE THAT CONTAINS JSON DATA.
Help me. Thanks.
var events = ...
, but no events are loaded. I have even tried indocument.Ready
and without it, bothevents...
options. – DhavalR