Set resourceOrder dynamically after the scheduler was rendered

Question

I'm using the fullCalendar Scheduler in an Angular 1.5 application.

I wrapped it into a directive and inside the directive I have a config object with all the properties

var calendarConfig = {
  schedulerLicenseKey: '----------------------------',
  resources: function (callback) {
    scope.getResources()(callback);
  },
  resourceColumns: [
    {
      labelText: 'Name',
      field: 'name'
    },
    {
      labelText: 'Id',
      field: 'id',
      width: "85px"
    }
  ],
  resourceOrder: "name",
  defaultView: "timelineMonth",
  resourceLabelText: "Test",
  resourceAreaWidth: "17%",
  aspectRatio: '100%',
  header: {
    left: 'reorderBtn',
    center: 'title',
    right: 'prev next'
  },
  customButtons: {
    sortName: {
      text: 'reorderBtn',
      click: function (oEvent) {
        ---------- how to perform the reordering inside here ? ----
      }
    }
  },
  eventClick: eventClick,
  dayClick: dayClick,
  viewRender: viewRender,
  weekNumbers: true,
};

I noticed that scheduler has a property called "resourceOrder" which works nice at initialization.

My use case is when I press the button I would like to see the resources sorted by the name descending.

I tried to use

$(element).fullCalendar('getView').options.resourceOrder = "-name"
$(element).fullCalendar('render')

but it does not work.

I can sort the resources outside the directive manually and then reset the sorted resources again as a source, but I would like to avoid this and make use of the nice property "resourceOrder" that scheduler provides.

Any ideas? Or any best-practices on how to sort the resources by one column at a time?

score 2 · Accepted Answer · answered Jun 13 '17 at 15:21

2

You can set or get fullCalendar options dynamicaly using fullCalendar setters and getters.

In your case:

$('#calendar').fullCalendar('option', 'resourceOrder', '-name');

answered Jun 13 '17 at 15:21

Laurynas

736
4
14

works great. I can remove the workaround now! :D many thanks!! – gmodrogan Jun 14 '17 at 14:58

score 0 · Answer 2 · answered Sep 17 '21 at 08:51

0

For FullCalendar v5.0+

calendar.setOption('resourceOrder', '-name')

answered Sep 17 '21 at 08:51

Channel

2,183
21
16

Abolfazl Roshanzamir · Answer 3 · 2021-12-08T11:22:33.227

In Angular2+ and FullCalendar5

The default value for resourceOrder is : 'id, title'. to override the default value

calendarOptions: CalendarOptions = {
  height: "500px",
  resourceOrder: 'type1', // Here ...
  // resourceOrder: '-type1', // If prefixed with a minus sign like '-type1', the ordering will be descending.
  //resourceOrder: 'type1,type2', //  Compound ordering criteria can be specified as a single string separated by commas.
  resources: [
    {
      id: 'A',
      title: 'Resource A',
      type1: 10,
      type2: 55
    },
    {
      id: 'B',
      title: 'Resource B',
      type1: 12,
      type2: 60
    },
  ],
  ...
}

Set resourceOrder dynamically after the scheduler was rendered

3 Answers3