Hello All,
I was wondering if someone could give me some pointers to help
optimize my jQuery Full Calendar Code. The issue i'm running into is
when I fetch a lot of events through AJAX (> 25), the browser stalls
and becomes unresponsive usually resulting in a message to the user to
abort the script. I'm trying to avoid this error, and I was wondering
if there was something I could do in my function to improve the
loading time.
Here is a copy of the function I'm running:
//Load the Business Unit Calendar Events
function ajaxBUEvents(start, end){
//Loop through the selected checked calendars
$(selectBUCalendars()).each(function(i, cal){
$.ajax({
type: 'POST',
data: {'startDate': start, 'endDate': end, 'buCals[]':
cal},
url: '<?=
site_url('AJAX/calendar_ajax/get_cal_events'); ?>',
dataType: 'json',
async: false,
beforeSend: function(){
$('#loading-dialog').dialog({minHeight: 100,
width: 250}).dialog
('open');
$('#loading-dialog p').text('Loading '+cal+'
Calendar Events');
},
success: function(calevents){
$.each(calevents, function(i, calevent){
$('#calendar').fullCalendar('renderEvent', calevent, true);
});
}
});
});
$('#loading-dialog').dialog('close');
}
And here is a sample of the JSON that is returned, this is only one
event. Sometimes there can be 50+ events returned:
[{"id":4377,"title":"BWR - Lighting Affiliates Dinner -
Actualized","start":1259874000,"end":1259888400,"className":"BWR
Actualized","allDay":false,"editable":false}]
Thank you for the help!