FullCalendar: refetchEvents call causes to all meetings to blink during re-rendering

Question

I play with fullCalendar and I use refetchEvents:

$('#calendar').fullCalendar('refetchEvents');

It works properly and this command calls events method with callback

events: function (start, end, timezone, callback) { /* ... */ }

however it first remove all meetings from calendar and after - renders new ones. This approach causes to all table to blink (different from google behaviour).

Is there any other way to render meetings without clear-add?

---

Seems like I need to add only deltas that makes work too hard, messy and not stable

Thanks,

Answer 1

My suggestion is to do the ajax request first (where you initially put .fullCalendar('refetchEvents')), and if it succeeds, then call refetchevents. The code will look something like this:

var events = [];
$.get('/events/get', function(result){
    events = result;
});    
$('#calendar').fullCalendar({
    events: function (start, end, timezone, callback) {
        callback(events);
    }
});

Answer 2

Use below approach instead of refetchEvents so it's not blinking.

var events = {
                 url: '/getEVents',
                 type: 'GET',
             }
$('#calendar').fullCalendar('removeEventSource', events);
$('#calendar').fullCalendar('addEventSource', events);

Answer 3

Add this in your ajax parameter :

async:false,

$.ajax({
    url: calendar_url + '&start'+start.unix()+'&end='+end.unix(),
    dataType: 'JSON',
    async:false,
    success: function(response) {
   }
})