中文Ext排序问题

最新推荐文章于 2018-01-05 22:46:00 发布

wyfh2010

最新推荐文章于 2018-01-05 22:46:00 发布

阅读量926

点赞数

文章标签： ext function header stylesheet string html

本文链接：https://blog.youkuaiyun.com/wyfh2010/article/details/6250854

版权

国际上都使用ASC码进行排序，面我们却按拼音排序，EXT自动排好的中文在我们看来却是一团糟。为了让Grid实现中文排序的功能，我们需要重写Ext.data.Store的applySort函数，代码如下：

Ext.data.Store.prototype.applySort = function() {
    if (this.sortInfo && !this.remoteSort) {
        var s = this.sortInfo, f = s.field;
        var st = this.fields.get(f).sortType;
        var fn = function(r1, r2) {
            var v1 = st(r1.data[f]), v2 = st(r2.data[f]);
            if (typeof(v1) == "string") {
                return v1.localeCompare(v2);
            }
            return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
        };
        this.data.sort(s.direction, fn);
        if(this.snapshot && this.snapshot != this.data) {
            this.snapshot.sort(s.direction, fn);
        }
    }
};
Ext.data.Store.prototype.applySort = function() {
    if (this.sortInfo && !this.remoteSort) {
        var s = this.sortInfo, f = s.field;
        var st = this.fields.get(f).sortType;
        var fn = function(r1, r2) {
            var v1 = st(r1.data[f]), v2 = st(r2.data[f]);
            if (typeof(v1) == "string") {
                return v1.localeCompare(v2);
            }
            return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
        };
        this.data.sort(s.direction, fn);
        if(this.snapshot && this.snapshot != this.data) {
            this.snapshot.sort(s.direction, fn);
        }
    }
};

你可以把这段代码加到ext-all.js文件的最后，或者放到HTML页面的EXT初始化之后，实际代码调用之前。

例：

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
        <title>02.basic</title>
        <link rel="stylesheet" type="text/css" href="resources/css/ext-all.css" />
        <script type="text/javascript" src="ext-base.js"></script>
        <script type="text/javascript" src="ext-all.js"></script>
    <script type="text/javascript" src="ext-lang-zh_CN.js"></script>
        <script type="text/javascript">
Ext.data.Store.prototype.applySort = function() {
    if (this.sortInfo && !this.remoteSort) {
        var s = this.sortInfo, f = s.field;
        var st = this.fields.get(f).sortType;
        var fn = function(r1, r2) {
            var v1 = st(r1.data[f]), v2 = st(r2.data[f]);
            if (typeof(v1) == "string") {
                return v1.localeCompare(v2);
            }
            return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
        };
        this.data.sort(s.direction, fn);
        if(this.snapshot && this.snapshot != this.data) {
            this.snapshot.sort(s.direction, fn);
        }
    }
};

Ext.onReady(function(){

var cm=new Ext.grid.ColumnModel([
{header:'编号',dataIndex:'id',sortable:true},
{header:'用户名',dataIndex:'username',sortable:true},
{header:'密码',dataIndex:'password',sortable:true},
{header:'年级',dataIndex:'grade',sortable:true}
]);

var data=[
['1','工','pwd1','grade1'],
['2','了','pwd2','grade2'],
['3','以','pwd3','grade3'],
['4','在','pwd4','grade4'],
['5','有','pwd5','grade5'],
['6','地','pwd6','grade6'],
['7','一','pwd7','grade7']
];

var store=new Ext.data.Store({
proxy:new Ext.data.MemoryProxy(data),
reader:new Ext.data.ArrayReader({},[
{name:'id'},
{name:'username'},
{name:'password'},
{name:'grade'}
])
});
store.load();

var grid=new Ext.grid.GridPanel({
autoHeight:true,
width:400,
loadMask:true,
renderTo:'grid',
store:store,
cm:cm
});

});
        </script>
    </head>
    <body>
    <div id="grid"></div>
    </body>
</html>