javascript - JQuery Full Calendar - edit calendar view after initialization

Question

At the beginning of the script, I have many options passed on to the calendar.

After it is initialized, executing the following doesn't change the view of the existing calendar, but creates a new calendar instead:

$('.calendar-container').fullCalendar({
   defaultView: 'agendaWeek'
});

Question: how do I change the view of the calendar which already exists in the .calendar-container div?

Answer 1

FullCalendar only supports change of a few options after initialization, like height, contentHeight and aspectRatio. If you want to change other options, you should destroy the current calendar, and initialize FullCalendar again with the new options.

You might want to remember the current state, so you can recreate it after the calendar has been destroyed. Include this callback in your FullCalendar options, and save the view in some variable that you can access after the calendar has been destroyed:

viewDisplay: function(view) {
    latestView = view;
}

Then you can call these methods after the calendar has been reinitialized, and recreate the state the calendar was in (like the same view and date range):

$("#calendar").fullCalendar('changeView', latestView.name);
$("#calendar").fullCalendar('gotoDate', latestView.start);