`
stoneuu
  • 浏览: 46394 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

ext js 中文排序

 
阅读更多

放到ext-all.js最后或页面ext初始之前

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=gbk">
        <title>03.grid</title>
        <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
        <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
        <script type="text/javascript" src="../../ext-all.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,width:35},
        {header:'名称',dataIndex:'name',sortable:true,width:80},
        {id:'descn',header:'描述',dataIndex:'descn',sortable:true,width:200}
    ]);

    var data = [
        ['1','啊','descn1'],
        ['2','啵','descn2'],
        ['3','呲','descn3'],
        ['4','嘚','descn4'],
        ['5','咯','descn5']
    ];

    var store = new Ext.data.Store({
        proxy: new Ext.data.MemoryProxy(data),
        reader: new Ext.data.ArrayReader({}, [
            {name: 'id'},
            {name: 'name'},
            {name: 'descn'}
        ]),
        sortInfo: {field: "name", direction: "ASC"}
    });
    store.load();

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

});
        </script>
    </head>
    <body>
        <script type="text/javascript" src="../shared/examples.js"></script>
        <div id="grid"></div>
    </body>
</html>

 

分享到:
评论

相关推荐

    Ext中文排序问题

    在ExtJS中,可以通过重写`Ext.data.Store.prototype.applySort`方法来实现中文排序。具体步骤如下: 1. **检查排序信息**:首先判断当前Store是否设置了排序信息,并且不是远程排序。 2. **获取字段信息**:从排序...

    解决Ext Grid中文排序问题

    在EXT JS框架中,Ext Grid是一个非常常用的组件,用于展示数据并支持各种操作,如排序、筛选和分页。然而,默认情况下,EXT Grid遵循ASCII码排序规则,这在处理中文字符时可能导致排序不符合预期,因为中文字符的...

    EXT 表格 中文排序

    一个关于EXTJs 表格 中文排序的例子

    EXT支持GRID中文排序

    本文将详细介绍如何通过自定义`Ext.data.Store`中的排序方法来支持中文排序功能。 #### 一、背景介绍 在使用EXT框架构建的项目中,`Ext.data.Store`是用于管理数据的核心类之一。它提供了存储、检索、排序等功能。...

    ext js 中文手册

    Ajax在Ext JS中是指通过异步JavaScript和XML技术实现与服务器的通信,从而使页面无需刷新即可更新数据或内容。Ext JS通过其Ajax组件和方法,支持各种请求和响应处理机制,大大提高了Web应用的交互性和用户体验。 ...

    EXT JS 3.0 中文版文档

    这个中文版文档对于那些不熟悉英文原版或者希望更深入理解EXT JS 3.0特性的开发者来说,是一份宝贵的资源。 EXT JS 3.0 的核心特性包括: 1. **组件化开发**:EXT JS 提供了大量的预定义组件,如表格、面板、菜单...

    ext js中文开发手册

    《EXT JS中文开发手册》详尽解读与应用指南 **一、EXT JS简介** EXT JS是一种基于JavaScript的开源框架,专为Web应用程序的界面开发而设计。它提供了一套丰富的UI组件,支持复杂的用户交互,并简化了AJAX交互的...

    JavaScript凌厉开发——Ext JS3详解与实践

    《JavaScript凌厉开发——Ext JS3详解与实践》是一本深度探讨JavaScript库Ext JS3的专著,旨在帮助开发者深入理解和高效运用这一强大的前端框架。本文将围绕标题、描述及标签,详细介绍Ext JS3的核心概念、关键特性...

    Ext分页排序 Ext分页排序

    在ExtJS中,分页排序是实现大规模数据展示的重要功能,它允许用户在大量数据中高效地浏览和管理信息。 **分页** 分页是将大数据集分割成较小的部分,每次只加载一部分数据到页面上,以提高性能和用户体验。在ExtJS...

    Ext JS - JavaScript Library

    Ext JS 是一个强大的JavaScript库,专门用于构建富客户端Web应用程序。这个库以其丰富的用户界面组件、数据绑定功能和可扩展性而闻名。Ext JS 提供了一整套预先封装的组件,如表格、面板、菜单、按钮、表单、树形...

    Ext JS Library 2.2

    Ext JS Library 2.2 是一个历史悠久且功能强大的JavaScript库,专为构建富客户端Web应用程序而设计。这个版本发布于2008年,是Ext JS系列中的一个重要里程碑,为开发者提供了丰富的用户界面组件和先进的数据绑定机制...

    深入浅出Ext JS(第2版) 随书光盘提供的书中实例

    《深入浅出Ext JS(第2版)》是一本详细解析Ext JS框架的权威书籍,其随书光盘包含了书中所有实例的源代码,这些代码对应于Ext JS的3.2.0版本。通过深入研究这些实例,读者可以更直观、更深入地理解Ext JS的强大功能和...

    Ext JS in Action

    - **The Venerable Grid Panel (备受尊敬的Grid Panel)**:Grid Panel是Ext JS中最常用的数据展示组件之一,它可以用来显示表格形式的数据,并支持排序、分页等功能。 - **The Editor Grid Panel (带有编辑功能的...

    EXT_JS实例,官方实例

    EXT_JS是一种基于JavaScript的开源富客户端框架,专为构建交互式、数据驱动的Web应用程序而设计。EXT JS的核心是EXT Core,它提供了一套高级的DOM操作和事件处理功能。EXT JS实例通常包括一系列预定义的组件、布局、...

    EXT JS学习资料

    EXT JS是一种基于JavaScript的开源富客户端框架,由Sencha公司开发。它主要用于构建桌面Web应用程序,提供丰富的用户界面组件和强大的数据绑定功能。EXT JS学习资料涵盖了EXT Js的基础到高级应用,是深入理解和掌握...

    EXT3.0 COOKBOOK中文版

    - **案例3:高级数据网格操作**:详细介绍如何利用Ext JS 3.0的数据网格组件进行复杂的数据管理和展示,包括排序、过滤等功能。 ### 结论 - 《EXT3.0 COOKBOOK中文版》是一本非常有价值的参考书籍,对于想要学习和...

    Ext.js教程和Ext.js API

    Ext.js 是一个强大的JavaScript库,专门用于构建富客户端的Web应用程序。它提供了丰富的用户界面组件和数据绑定功能,使得开发者可以构建出具有桌面应用级别的交互式网页应用。本教程和API文档聚焦于Ext.js 3.0版本...

    Ext JS Library 3.0 Pre-alph.zip

    Ext JS Library 3.0 Pre-alpha 是一个早期版本的JavaScript库,专为构建富客户端Web应用程序而设计。这个版本发布于2009年5月8日,是开发者们学习和掌握EXTJS3.0技术的重要资源。EXTJS3.0是Ext JS库的一个重要里程碑...

    深入浅出Ext JS第2版.pdf下载地址

    根据提供的信息,我们可以了解到这是一本关于Ext JS的书籍——《深入浅出Ext JS第2版》,虽然描述中提到了“其实这个不用下载”,但为了更好地理解和总结这本书的知识点,我们将基于标题、描述以及部分内容来探讨书...

    Ext JS实例 学生信息管理系统

    Ext JS是一种基于JavaScript的前端开发框架,用于构建富交互式的Web应用程序。它提供了一系列丰富的组件,包括表格、面板、窗口、菜单等,使得开发者能够轻松地创建功能强大的用户界面。在"Ext JS实例 学生信息管理...

Global site tag (gtag.js) - Google Analytics