jQuery EasyUI使用教程之在数据网格中自定义排序
<jQuery EasyUI最新试用版免费下载>
如果默认排序行为不能满足您的需求，您可以自定义数据网格的排序行为。
基本上用户可以在列上定义一个函数名为sorter的排序函数。这个函数将要接受两个值，返回值将如下：
valueA > valueB => return 1
valueA < valueB => return -1
自定义排序代码
<table id="tt"></table>
$(
'#tt'
).datagrid({
title:
'Custom Sort'
,
iconCls:
'icon-ok'
,
width:520,
height:250,
singleSelect:
true
,
remoteSort:
false
,
columns:[[
{field:
'itemid'
,title:
'Item ID'
,width:60,sortable:
true
},
{field:
'listprice'
,title:
'List Price'
,width:70,align:
'right'
,sortable:
true
},
{field:
'unitcost'
,title:
'Unit Cost'
,width:70,align:
'right'
,sortable:
true
},
{field:
'attr1'
,title:
'Attribute'
,width:120,sortable:
true
},
{field:
'date'
,title:
'Date'
,width:80,sortable:
true
,align:
'center'
,
sorter:
function
(a,b){
a = a.split(
'/'
);
b = b.split(
'/'
);
if
(a[2] == b[2]){
if
(a[0] == b[0]){
return
(a[1]>b[1]?1:-1);
}
else
{
return
(a[0]>b[0]?1:-1);
}
}
else
{
return
(a[2]>b[2]?1:-1);
}
}
},
{field:
'status'
,title:
'Status'
,width:40,align:
'center'
}
]]
}).datagrid(
'loadData'
, data);
正如您从这个代码中看到，我们创建了一个自定义排序日期。日期格式为“DD / MM / YYYY”，可以轻松地按年月日排序。
下载该EasyUI示例：easyui-datagrid-demo.zip