Geek Answers Handbook

FullCalendar on jQuery tabs without loading natively via ajax

I use my own custom function to populate events:

$('#calendar').fullCalendar({
  events:getCalendarData
});

And I get the calendar as one of my tabs using the jQuery tabs plugin (tabs are created by $ ('# tabs'). Tabs ();).

The setting works, except that I found that when the page first loads, the calendar performs an asynchronous request (I see it in Firebug), but if I switch to the tab that displays the calendar, it will be empty (the interface is ok, but no events). If I move to the next month and come back again, it will show the data in order. Also, if I make a calendar on the FIRST tab, it will work fine! Thus, it seems that only the initial request does not display events, possibly because the tab is hidden at boot time.

If I load a page, go to the calendar tab (no events), and I accidentally call

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

then it will load events. I tried putting this rendering call AFTER calling the fullCalendar callback, but without the dice.

callback(events);
$('#calendar').fullCalendar( 'render' );

It seems that one of the options could be binding

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

, .

?

-Brian

+5

More articles:


All Articles