How to dynamically change event sources?

Question

I am using jQuery FullCalendar plugin. I want to first load the calendar using events as an array. I do it like this:

events: <%= Model.Events %>

or

eventSources: [{
                 events: <%= Model.Events %>
              }]

Both methods work fine. I am using MVC 3.0 and <%= Model.Events %>returning an array of events in JSON format.

I want to use an array of events ONLY to bootstrap a calendar. Later, every time it is necessary that events be loaded, I want my events to be loaded using url '/ Calendar / Events'.

How can this be implemented?

I tried difference scripts with addEventSource/removeEventSourcein the callback viewDisplay, but nothing worked for me.

Answer 1

.fullCalendar( {

  eventSources : [ {
    url : '/Calendar/Events',
    type : 'GET'
  } ],

  viewDisplay : function( event ) {
     // assuming this will point to the full calendar,
     // might have to do something silly like
     // $( '#myCal' ).fullCalendar( 'refetchEvents' );
     this.refetchEvents();
  }
} );