PDA

View Full Version : grid custom sort



renoye
21 Mar 2012, 11:13 PM
Hi, all:

I have a very simple question about sort a grid column.
Let's say I have a field called 'name' and its type is string.
after sort, all the data list as
'abc1'
'abc10'
'abc2'
'abd27'
'abd3'
I want them list as
'abc1'
'abc2'
'abc10'
'abd3'
'abd27'

so basically I have to split the string, compare the alpha word first, then compare the number. That is why I do not see sortType gona help me here. It takes a value and output a comparable value. I do not know how to generate a comparable value for this situation.

I know I can define sorterFn at store.sorters. but that will only work initially and every time I click column head to sort, it still will generate wrong result. Any help here?

vietits
22 Mar 2012, 1:46 AM
1. The first solution is use sortType(value) to transform input value to a suitable format for sorting. For example:
abc1 -> abcAAAAAAA0000000001
abc10 -> abcAAAAAAA0000000010
abc2 -> abcAAAAAAA0000000002
abd27 -> abdAAAAAAA0000000027

2. The second solution is overriding the doSort() method to define your own sorting function


var grid = Ext.create('Ext.grid.panel',{
...
columns: [{
text: 'Name',
sortable : true,
dataIndex: 'name',
doSort: function(state) {
var ds = this.up('tablepanel').store;
var field = this.getSortParam();
ds.sort({
property: field,
direction: state,
sorterFn: function(v1, v2){
v1 = v1.get(field);
v2 = v2.get(field);
// transform v1 and v2 here
return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
}
});
}
....
});

renoye
22 Mar 2012, 11:22 AM
thank you.
it is very helpful

neelua9
27 May 2014, 11:15 AM
How can we override globally, something like Ext.override(Ext.grid.column.Column, { doSort:function(){}});