Heim > Datenbank > MySQL-Tutorial > Hauptteil

ExtJS4.2学习(四)Grid表格中文排序问题

WBOY
Freigeben: 2016-06-07 15:07:00
Original
1268 Leute haben es durchsucht

我们在表中指定某列排序的时候,我发现排序的时候,中文并没有很好的按照规律排序,国际上都使用ASCII码进行排序,而我们却拼音排序,Ext自动排好的中文在我们看起来是一团糟。 如下代码数据: 1 2 3 4 5 6 7 var data =[ [ '1' , '啊' , '描述01' ], [ '2'

我们在表格中指定某列排序的时候,我发现排序的时候,中文并没有很好的按照规律排序,国际上都使用ASCII码进行排序,而我们却拼音排序,Ext自动排好的中文在我们看起来是一团糟。

如下代码数据:

1

2

3

4

5

6

7

var data =[

        ['1','啊','描述01'],

        ['2','波','描述02'],

        ['3','呲','描述03'],

        ['4','嘚','描述04'],

        ['5','咯','描述05']

    ];

为了立刻看到效果,我们通过sorters属性来为Ext.data.ArrayStore设置一个默认的排序方式,如下面的代码:

1

2

3

4

5

6

7

8

9

var store = new Ext.data.ArrayStore({

data:data,

fields:[

   {name:'id'}, //mapping:0 这样的可以指定列显示的位置,0代表第1列,可以随意设置列显示的位置

   {name:'name'},

   {name:'descn'}

],

sorters:[{property:"name",direction:"ASC"}] //给定一个默认的排序方式

});

效果就是下面这样:
ExtJS4.2学习(四)Grid表格中文排序问题
解决办法如下代码,你可以把这段代码放到ext-all.js文件的最后,或者放到HTML页面的最上面,总之要在Ext初始化之后,实际代码调用之前执行。

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

Ext.data.Store.prototype.createComparator = function(sorters){

    return function(r1, r2){

        var s = sorters[0], f=s.property;

        var v1 = r1.data[f], v2 = r2.data[f];

               

        var result = 0;

        if(typeof(v1) == "string"){

            result = v1.localeCompare(v2);

            if(s.direction == 'DESC'){

                result *=-1;

            }

        else {

            result =sorters[0].sort(r1, r2);

        }

               

        var length = sorters.length;

               

        for(var i = 1; i<length i></length>

            s = sorters[i];

            f = s.property;

            v1 = r1.data[f];

            v2 = r2.data[f];

            if(typeof(v1) == "string"){

                result = result || v1.localeCompare(v2);

                if(s.direction == 'DESC'){

                    result *=-1;

                }

            else {

                result = result || s.sort.call(this, r1, r2);

            }

        }

        return result;

    };

};

现在来运行,效果如下:
ExtJS4.2学习(四)Grid表格中文排序问题
效果看起来不错。

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!