Onion
Onion

Reputation: 1832

JQuery Full Calendar - edit calendar view after initialization

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?

Upvotes: 4

Views: 5055

Answers (3)

Henrique C.
Henrique C.

Reputation: 978

Well imagine you want to change eventsources....

function getSources(switcher){    

        if(switcher== "option1"){
            return [othersources.opt1,othersources.opt2];

        }else{
            if(switcher== "option2"){                       
            return [othersources.opt3];}
        }      
    }


...
eventSources: getSources(switcher),
...

You can find a way to change any property with a simple function...

Hope it helped...

Upvotes: 0

Regin Larsen
Regin Larsen

Reputation: 1152

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);

Upvotes: 3

clu3Less
clu3Less

Reputation: 1882

If you go through their documentation it is clearly specified.

There is a function to change the view.

.fullCalendar( 'changeView', viewName )

http://arshaw.com/fullcalendar/docs/views/changeView/

Upvotes: 1

Related Questions