OnMonthChange event

Question

I am trying to implement the following: by default (at page's start) I fill the list of events with the array. After that if user wants to change the month or year I want to retrieve the events via AJAX call and re-fill the events property of the fullcalendar.

Here is the init code:

function initializeCalendar(year, month, events) {
            $('#orders-calendar').fullCalendar({
                header: {
                    left: 'prev,next',
                    center: 'title',
                    right: ''
                },
                firstDay: 1,
                year: year,
                month: month, 
                events: events,
                eventClick: function(event) {
                    History.pushState({id: event.id}, null, '?id=' + event.id);
                    return false;
                }
            });
        };

How can I assign onchange event after initialization? Something like:

$('#orders-calendar').on('change', function(date) { ... });

Thank you in advance!

Answer 1

I'm not familiar with fullcalendar but the documentation does not reveal such kind of event to be raised.

But instead of passing an array to the events parameter you should define a function which will perform your ajax calls and return your calendar events.

The events parameter indeed accepts a function( start, end, callback ) { } as described in the documentation, or if your server call returns json, you could just define the feed url as described here

EDIT :

The following functions prev(), next(), prevYear(), nextYear(), today(), gotoDate(...), incrementDate(...) are all making call to renderView(inc) which itself internally calls _renderView(inc) which trigger the viewRender event.

If it does not fit your requirement, have a look in the source code to check if some events are raised when you need. But i would not suggest to rely on undocumented events. Undocumented events may change preventing your app to run after plugin update.