从书中看到这个通过重写Ext.data.Store的applySort函数实现Grid支持中文排序,摘抄下来。以备不时之需。
1
Ext.data.Store.prototype.applySort = function()
{
2
if(this.sortInfo && !this.remoteSort)
{
3
var s = this.sortInfo, f = s.field;
4
var st = this.fields.get(f).sortType;
5
var fn = function(r1,r2)
{
6
var v1 = st(r1.data[f]),v2 = st(r2.data[f]);
7
if(typeof(v1)=="string")
{
8
return v1.localeCompare(v2);
9
}
10
return v1 > v2 ?1:(v1 < v2?-1:0);
11
};
12
this.data.sort(s.direction, fn);
13
if(this.snapshot && this.snapshot != this.data)
{
14
this.snapshot.sort(s.direction,fn);
15
}
16
}
17
}
这段代码可以放在ext-all.js文件的最后,或放到html页面的最上面。主要是要在EXT初始化之后,实际代码调用之前执行。
附例如下:
1
<html>
2
<head>
3
<meta http-equiv="Content-Type" content="text/html; charset=gbk">
4
<title>03.grid</title>
5
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
6
<script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
7
<script type="text/javascript" src="../../ext-all.js"></script>
8
<script type="text/javascript">
9
Ext.data.Store.prototype.applySort = function()
{
10
if (this.sortInfo && !this.remoteSort)
{
11
var s = this.sortInfo, f = s.field;
12
var st = this.fields.get(f).sortType;
13
var fn = function(r1, r2)
{
14
var v1 = st(r1.data[f]), v2 = st(r2.data[f]);
15
if (typeof(v1) == "string")
{
16
return v1.localeCompare(v2);
17
}
18
return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
19
};
20
this.data.sort(s.direction, fn);
21
if(this.snapshot && this.snapshot != this.data)
{
22
this.snapshot.sort(s.direction, fn);
23
}
24
}
25
};
26
27
28
Ext.onReady(function()
{
29
30
var cm = new Ext.grid.ColumnModel([
31
{header:'编号',dataIndex:'id',sortable:true,width:35},
32
{header:'名称',dataIndex:'name',sortable:true,width:80},
33
{id:'descn',header:'描述',dataIndex:'descn',sortable:true,width:200}
34
]);
35
36
var data = [
37
['1','啊','descn1'],
38
['2','啵','descn2'],
39
['3','呲','descn3'],
40
['4','嘚','descn4'],
41
['5','咯','descn5']
42
];
43
44
var store = new Ext.data.Store(
{
45
proxy: new Ext.data.MemoryProxy(data),
46
reader: new Ext.data.ArrayReader(
{}, [
47
{name: 'id'},
48
{name: 'name'},
49
{name: 'descn'}
50
]),
51
sortInfo:
{field: "name", direction: "ASC"}
52
});
53
store.load();
54
55
var grid = new Ext.grid.GridPanel(
{
56
autoHeight: true,
57
renderTo: 'grid',
58
store: store,
59
cm: cm,
60
autoExpandColumn: 'descn'
61
});
62
63
});
64
</script>
65
</head>
66
<body>
67
<script type="text/javascript" src="../examples.js"></script>
68
<div id="grid"></div>
69
</body>
70
</html>
71