Reputation: 1727
One way of doing the multi column grouping is to override the Grouper function to provide the necessary functionality..
Ext.util.Grouper.override({
getGroupString: function (item) {
return item.get('account') + ', Currency: ' + item.get('currCd');
}
});
// Define summary store
Ext.define('xxx.store.Summaries', {
extend: 'Ext.data.JsonStore',
alias: 'store.summaries',
requires: ['xxx.view.summary.SummaryGrouper'],
model: 'xxx.model.Summary',
storeId: 'summaryStore',
grouper: {
property: 'account'
},
The other way of doing this grouping is by grouper property in store.
grouper: {
property: 'account',
groupFn: function (item) {
return item.get('account') + ', Currency: ' + item.get('currCd');
}
},
This one works the first time, but, when I refresh, it doesn't take the groupFn that I give it just groups by account. I am guessing this has something to do with the configuration. Could you suggest why?
Another way of doing this is by extending Grouper, but, I think I am doing something wrong. this is not getting called or maybe I am doing something wrong.
// Define summary grouper
Ext.define('Banking.view.summary.SummaryGrouper', {
extend: 'Ext.util.Grouper',
alias: 'widget.summaryGrouper',
isGrouper: true,
initComponent: function () {
this.callParent(arguments);
},
config: {
groupFn: function(record) {
return record.get('account') + ', Currency:' + record.get('currCd');
},
sortProperty: 'account'
},
constructor:function(cfg){
this.callParent(arguments);//Calling the parent class constructor
this.initConfig(cfg);//Initializing the component
}
});
Could you suggest what am I doing wrong here when I am extending the Grouper class?
Upvotes: 2
Views: 3374
Reputation: 238
Try to remove the 'property' property from the grouper object.
grouper: {
groupFn: function (item) {
return item.get('account') + ', Currency: ' + item.get('currCd');
}
}
Upvotes: 3