Sencha Touch : dynamically update grouper function

Question

I have a sencha touch 2.3 app that has a list which is grouped-

grouped: true,

The grouper function is defined in the store -

grouper: {
    groupFn: function(record) {
        return record.get('name');
    }
}

All this works fine. Now, during runtime, I want to update the grouper function, eg: group it by some other record attribute like location

How do I do this dynamically?

I plan to update the grouper function when the user taps a button (eg: User wants to see the list of records grouped by location)

How to achieve this?

Don't know if that is supported but the way could be: Ext.getStore().getGrouper().setGroupFn(function(){ /* new grouping logic*/ }); — Andrea Casaccia

Saffron Saffron · Accepted Answer · 2014-06-19T08:27:08

I believe you can use the setGrouper method provided by the Store class : http://docs.sencha.com/touch/2.3.2/#!/api/Ext.data.Store-method-setGrouper

You just need specify your gouper again :

yourStore.setGrouper({
    groupFn : function(record) {
        return record.get('location');
    }
});

You may have to refresh your list manually, as I don't think there is an event that is fired by this change, and that is caught by the List to repaint.

Sencha Touch : dynamically update grouper function

1 Answers