设置排序

数据网格的所有列可以通过点击列表头来排序。我们可以定义哪列可以排序，默认的列是不能排序的，除非设置的 sortable 属性为 true。

创建数据网格

<table id="tt" class="easyui-datagrid"style="width:600px;height:250px"		
url="datagrid8_getdata.php"		
title="Load Data" iconCls="icon-save"		
rownumbers="true" pagination="true">	
<thead>		
<tr>			
<th field="itemid" width="80" sortable="true">Item ID</th>			
<th field="productid" width="80" sortable="true">Product ID</th>			
<th field="listprice" width="80" align="right" sortable="true">List Price</th>			
<th field="unitcost" width="80" align="right" sortable="true">Unit Cost</th>			
<th field="attr1" width="150">Attribute</th>			
<th field="status" width="60" align="center">Stauts</th>		
</tr>	
</thead>
</table>

我们定义一些可排序的列，包含itemid、productid、listprice、unitcost 等。'attr1' 列和 'status' 列不能排序。

当排序时，数据网格将发送两个参数到远程服务器：

• sort：排序列字段名。
• order：排序方式，可以是 'asc' 或者 'desc'，默认值是 'asc'。

服务器端代码

$page = isset($_POST['page']) ? intval($_POST['page']) : 1;
$rows = isset($_POST['rows']) ? intval($_POST['rows']) : 10;
$sort = isset($_POST['sort']) ? strval($_POST['sort']) : 'itemid';
$order = isset($_POST['order']) ? strval($_POST['order']) : 'asc';
$offset = ($page-1)*$rows; 
$result = array(); include 'conn.php'; 
$rs = mysql_query("select count(*) from item");
$row = mysql_fetch_row($rs);
$result["total"] = $row[0];
$rs = mysql_query("select * from item order by 
$sort $order limit $offset,$rows"); 
$items = array();
while($row = mysql_fetch_object($rs)){	
array_push($items, $row);
}
$result["rows"] = $items; 
echo json_encode($result);

最基础的，用户可以在列上定义一个排序函数，函数名是 sorter。这个函数将接受两个值，返回值将如下：

valueA > valueB => 返回 1

valueA < valueB => 返回 -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);

从这段代码中可以看到，我们为 date 列创建了自定义的 sorter。日期的格式是 'dd/mm/yyyy'，可以轻松的按年月日排序。