PDA

View Full Version : How to sort all null or empty values to the bottom of the Grid Panel ?



Toolen
27 Feb 2014, 3:31 AM
Hello, for example:


default
ASC
DESC


3
1
4


4
2
3


-
3
2


1
4
1


2
-
-


-
-
-




Would You might show me code example ? Thank You!

Farish
27 Feb 2014, 8:04 AM
I would recommend that you add a doSort method in your grid column(s) and in that, you can use a custom sorter.


var store = Ext.create('Ext.data.Store', {
fields:['id', 'Asc', 'Desc'],
data:[
{ 'id': 1, "Asc": 1, "Desc": 1 },
{ 'id': 2, "Asc": 2, "Desc": 2 },
{ 'id': 3, "Asc": 3, "Desc": 3 },
{ 'id': 4 }
]
});

Ext.create('Ext.grid.Panel', {
title: 'Simpsons',
store: store,
columns: [
{ text: 'ID', dataIndex: 'id' },
{ text: 'Asc', dataIndex: 'Asc', flex: 1,
doSort: function(direction)
{
var gridStore = this.up('grid').getStore();
var field = this.getSortParam();
gridStore.sort({
property: field,
direction: direction,
sorterFn: function(v1, v2){
// here you can do your own sorting
}
});
}
},
{ text: 'Desc', dataIndex: 'Desc', flex: 1 }
],
height: 200,
width: 400,
renderTo: Ext.getBody()
});

on help on how to sort using the sorterFn, take a look at the documentation at:
http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.util.Sorter

Toolen
27 Feb 2014, 11:36 PM
Thanks a lot! My sorter function as additional

mySort = function(v1, v2) {
var sortDirection;
if (this.direction) {
sortDirection = this.direction.toUpperCase();
}
if ((v1 === null || v1 === '') && (v2 === null || v2 === '')) {
return 0;
} else if (v1 === null || v1 === '') {
if (sortDirection === 'DESC') {
return -1;
} else if (sortDirection === 'ASC') {
return 1;
} else {
return 1;
}
} else if (v2 === null || v2 === '') {
if (sortDirection === 'ASC') {
return -1;
} else if (sortDirection === 'DESC') {
return 1;
} else {
return -1;
}
} else {
return v1.localeCompare(v2);
}
};