zoukankan      html  css  js  c++  java
  • ExtJS4.2学习(四)Grid表格中文排序问题(转)

    鸣谢:http://www.shuyangyang.com.cn/jishuliangongfang/qianduanjishu/2013-11-07/173.html

    -----------------------------------------------------------------------------------------

    如果不进行任何排序的设置,Extjs有默认的排序。

    下面的代码没有对Grid进行排序的设置:

    /**
     * Grid
     * 此js对Grid的某列进行了排序
     */
     
    //表格数据最起码有列、数据、转换原始数据这3项  
    Ext.onReady(function(){  
        //定义列  
        var columns = [  
            {header:'编号',dataIndex:'id'}, //sortable:true 可设置是否为该列进行排序  
            {header:'名称',dataIndex:'name'},  
            {header:'描述',dataIndex:'descn'}  
          ];  
        //定义数据  
        var data =[  
            ['1','啊','描述01'],  
            ['2','波','描述02'],  
            ['3','呲','描述03'],  
            ['4','嘚','描述04'],  
            ['5','咯','描述05']   
        ];  
        //转换原始数据为“EXT可以显示的数据”  
        var store = new Ext.data.ArrayStore({  
            data:data,  
            fields:[  
               {name:'id'}, //mapping:0 这样的可以指定列显示的位置,0代表第1列,可以随意设置列显示的位置  
               {name:'name'},  
               {name:'descn'}  
            ]
            
        });  
        //加载数据  
        store.load();  
          
        //创建表格  
        var grid = new Ext.grid.GridPanel({  
            renderTo:'grid', //渲染位置  
            store:store, //转换后的数据  
            columns:columns, //显示列  
            stripeRows:true, //斑马线效果  
            //enableColumnMove: false, //禁止拖放列  
            //enableColumnResize: false, //禁止改变列宽度  
            loadMask:true, //显示遮罩和提示功能,即加载Loading……  
            forceFit:true //自动填满表格  
        });  
    });  

    运行结果:

    可以看出是按照英文abcde顺序进行排序的。

    下面的代码演示了按照name列按照ASCII码进行排序:

    var store = new Ext.data.ArrayStore({  
            data:data,  
            fields:[  
               {name:'id'}, //mapping:0 这样的可以指定列显示的位置,0代表第1列,可以随意设置列显示的位置  
               {name:'name'},  
               {name:'descn'}  
            ],
            sorters:[{property:"name",direction:"ASC"}] //给定一个默认的排序方式  
        });

    运行结果:

    看起来乱糟糟的,那有没有按汉语拼音排序呢?是有的。请看本博客的鸣谢网址。

  • 相关阅读:
    python @ 修饰符
    收集一些NOSQL网站,以后有时间再来写NOSQL的一些心得
    网站性能问答
    CSLA筆記
    Google PR值原理和详细解说
    通天塔导游:各种编程语言优缺点
    网站访客行为和心理分析--决定网站的回头率
    pymongo 基本操作
    [摘]如何成为python高手
    用数组,列表或字典来代替选择语句
  • 原文地址:https://www.cnblogs.com/wql025/p/4975686.html
Copyright © 2011-2022 走看看