Change default event sort order on FullCalendar month View
I have a fullcalendar working with multiple calendars displayed in the month view. The different calendars are color coded. I have the calendars sorted by name on all views, but when they are rendered in the FullCalendar display they are sorted by title of the event.
Is there anyway to override the default sort for the day?
Hi,
Yes, you can override the default sort of the day using a new event in the version 2.4.0 of fullcalendar called eventOrder.
By default, FullCalendar decides that events with longer durations and earlier start times are sorted above other events. However, events often have the same exact start time and duration, which is especially true for all-day events. By default, when this happens, events are sorted alphabetically by title. eventOrder provides the ability to override this behavior .
If you want to completely override the sorting by start date for allDaySlot, month, basics views. For example to sort them by color.
1.Initialise eventOrder to color. (html/php file you are using)
eventOrder: 'color,start'
2.Change the compareSegs function. (fullcalendar.js)
// original function
compareSegs: function(seg1, seg2) {
return seg1.eventStartMS - seg2.eventStartMS || // earlier events go first
seg2.eventDurationMS - seg1.eventDurationMS || // tie? longer events go first
seg2.event.allDay - seg1.event.allDay || // tie? put all-day events first (booleans cast to 0/1)
compareByFieldSpecs(seg1.event, seg2.event, this.view.eventOrderSpecs);
}
// custom function
compareSegs: function(seg1, seg2) {
if(this.view.name=="basicWeek"){ // ordering events by color in ListView
return seg2.event.allDay - seg1.event.allDay || // tie? put all-day events first (booleans cast to 0/1)
compareByFieldSpecs(seg1.event, seg2.event, this.view.eventOrderSpecs);
}
else{
return seg1.eventStartMS - seg2.eventStartMS || // earlier events go first
seg2.eventDurationMS - seg1.eventDurationMS || // tie? longer events go first
seg2.event.allDay - seg1.event.allDay || // tie? put all-day events first (booleans cast to 0/1)
compareByFieldSpecs(seg1.event, seg2.event, this.view.eventOrderSpecs);
}
}
In this case I only want to sort event by color in the "basicVeek" view. Then I have remove the eventStartMS & eventDurationMS tests.
REMOVE:
seg1.eventStartMS - seg2.eventStartMS || // earlier events go first
seg2.eventDurationMS - seg1.eventDurationMS || // tie? longer events go first