fullCalendar how to set the events programmatically - fullcalendar

Question

I'm having a problem setting the calendar event grammatically.
I have a page where the user can select the client to display the event for using a drop down. I request the events via an Ajax call. And this all looks good. But I'm having a problem setting the events in fullCalendar.
This is my code to set the events:
success: function(resp){
var r = resp.output;
console.dir(r);
jQuery('#student').html(r.studentname);
jQuery('#calendar').fullCalendar( 'removeEvents' ); // <= This works
jQuery('#calendar').fullCalendar( 'events', r.events ); // <= This doesn't
}
This is a dump of the ajax response:
events "[{
id: 1,
title: 'Acupuncture',
start: new Date(2013, 5, 29, 10, 00),
end: new Date(2013, 5, 29, 10, 30),
allDay: false
}
,
{
id: 2,
title: 'Acupuncture',
start: new Date(2013, 6, 30, 10, 00),
end: new Date(2013, 6, 30, 10, 30),
allDay: false
}
,
{
id: 3,
title: 'Chiropractor',
start: new Date(2013, 6, 31, 11, 00),
end: new Date(2013, 6, 31, 11, 15),
allDay: false
}
]
"
id "1"
studentname "Tarah Yates"
I couldn't find any examples on how to do this so I'm not sure if I am doing it right.
I just noticed the quotes around the event list, maybe that's the problem?
If that's not the problem, does anybody have any thoughts on why it's not working?

Answer 1

gwardell that response needs to be iterated so you can fetch the elements of the array. But i would change the type of response to JSON like this:
[{
"id": "1",
"title": "Acupuncture",
"start": "29-05-2013 10:00", //adapted this date format is accepted by fullcalendar
"end": "29-05-2013 10:30",
"allDay": false //You dont need to adapt this it was a mistake of me. Leave it be.
},etc, etc, etc]
Notice that there can only be simple JSON, you can't have a response with complex JSON with sub-arrays.
PS. - Go and study a bit of JSON format on the NET and you will figure it out i'm sure.
Not sure about that line, but what you wanna do will only create the event in that view while your are there, when you switch to other view will disapear. What you want to do is to save to a Database or whatever you use to store data to store the events. Then they will be persistent and when you refetchevents the event will apear...so jQuery('#calendar').fullCalendar( 'events', 'refetchevents' );
How to pass the ID in ajax call assuming you are doing this with JSON and Jquery Ajax
$.ajax({
type: 'POST',
url: _url,
data: {'id': 9999, //Just pass like this or you can set like a function 'id':getMyID(),
'title':name,
'start':start,
'end':end,
'allDay': allDay,
'editable': true,
},
success: function(data) {
//TODO Do stuff
}
});
or if you have an array of eventsources
var othersources = {
ausencias: {
url: _url,
type: 'POST',
data:{
'id':getMyId(), // 'id':myidvalue
'func':func,
'year':y
},
cache: false,
color: '#C1272D',
textColor: 'white'
}}