放到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>
相关推荐
在ExtJS中，可以通过重写`Ext.data.Store.prototype.applySort`方法来实现中文排序。具体步骤如下： 1. **检查排序信息**：首先判断当前Store是否设置了排序信息，并且不是远程排序。 2. **获取字段信息**：从排序...
在EXT JS框架中，Ext Grid是一个非常常用的组件，用于展示数据并支持各种操作，如排序、筛选和分页。然而，默认情况下，EXT Grid遵循ASCII码排序规则，这在处理中文字符时可能导致排序不符合预期，因为中文字符的...
一个关于EXTJs 表格 中文排序的例子
本文将详细介绍如何通过自定义`Ext.data.Store`中的排序方法来支持中文排序功能。 #### 一、背景介绍 在使用EXT框架构建的项目中，`Ext.data.Store`是用于管理数据的核心类之一。它提供了存储、检索、排序等功能。...
Ajax在Ext JS中是指通过异步JavaScript和XML技术实现与服务器的通信，从而使页面无需刷新即可更新数据或内容。Ext JS通过其Ajax组件和方法，支持各种请求和响应处理机制，大大提高了Web应用的交互性和用户体验。 ...
这个中文版文档对于那些不熟悉英文原版或者希望更深入理解EXT JS 3.0特性的开发者来说，是一份宝贵的资源。 EXT JS 3.0 的核心特性包括： 1. **组件化开发**：EXT JS 提供了大量的预定义组件，如表格、面板、菜单...
《EXT JS中文开发手册》详尽解读与应用指南 **一、EXT JS简介** EXT JS是一种基于JavaScript的开源框架，专为Web应用程序的界面开发而设计。它提供了一套丰富的UI组件，支持复杂的用户交互，并简化了AJAX交互的...
《JavaScript凌厉开发——Ext JS3详解与实践》是一本深度探讨JavaScript库Ext JS3的专著，旨在帮助开发者深入理解和高效运用这一强大的前端框架。本文将围绕标题、描述及标签，详细介绍Ext JS3的核心概念、关键特性...
在ExtJS中，分页排序是实现大规模数据展示的重要功能，它允许用户在大量数据中高效地浏览和管理信息。 **分页** 分页是将大数据集分割成较小的部分，每次只加载一部分数据到页面上，以提高性能和用户体验。在ExtJS...
Ext JS 是一个强大的JavaScript库，专门用于构建富客户端Web应用程序。这个库以其丰富的用户界面组件、数据绑定功能和可扩展性而闻名。Ext JS 提供了一整套预先封装的组件，如表格、面板、菜单、按钮、表单、树形...
Ext JS Library 2.2 是一个历史悠久且功能强大的JavaScript库，专为构建富客户端Web应用程序而设计。这个版本发布于2008年，是Ext JS系列中的一个重要里程碑，为开发者提供了丰富的用户界面组件和先进的数据绑定机制...
《深入浅出Ext JS(第2版)》是一本详细解析Ext JS框架的权威书籍，其随书光盘包含了书中所有实例的源代码，这些代码对应于Ext JS的3.2.0版本。通过深入研究这些实例，读者可以更直观、更深入地理解Ext JS的强大功能和...
- **The Venerable Grid Panel (备受尊敬的Grid Panel)**：Grid Panel是Ext JS中最常用的数据展示组件之一，它可以用来显示表格形式的数据，并支持排序、分页等功能。 - **The Editor Grid Panel (带有编辑功能的...
EXT_JS是一种基于JavaScript的开源富客户端框架，专为构建交互式、数据驱动的Web应用程序而设计。EXT JS的核心是EXT Core，它提供了一套高级的DOM操作和事件处理功能。EXT JS实例通常包括一系列预定义的组件、布局、...
EXT JS是一种基于JavaScript的开源富客户端框架，由Sencha公司开发。它主要用于构建桌面Web应用程序，提供丰富的用户界面组件和强大的数据绑定功能。EXT JS学习资料涵盖了EXT Js的基础到高级应用，是深入理解和掌握...
- **案例3：高级数据网格操作**：详细介绍如何利用Ext JS 3.0的数据网格组件进行复杂的数据管理和展示，包括排序、过滤等功能。 ### 结论 - 《EXT3.0 COOKBOOK中文版》是一本非常有价值的参考书籍，对于想要学习和...
Ext.js 是一个强大的JavaScript库，专门用于构建富客户端的Web应用程序。它提供了丰富的用户界面组件和数据绑定功能，使得开发者可以构建出具有桌面应用级别的交互式网页应用。本教程和API文档聚焦于Ext.js 3.0版本...
Ext JS Library 3.0 Pre-alpha 是一个早期版本的JavaScript库，专为构建富客户端Web应用程序而设计。这个版本发布于2009年5月8日，是开发者们学习和掌握EXTJS3.0技术的重要资源。EXTJS3.0是Ext JS库的一个重要里程碑...
根据提供的信息，我们可以了解到这是一本关于Ext JS的书籍——《深入浅出Ext JS第2版》，虽然描述中提到了“其实这个不用下载”，但为了更好地理解和总结这本书的知识点，我们将基于标题、描述以及部分内容来探讨书...
Ext JS是一种基于JavaScript的前端开发框架，用于构建富交互式的Web应用程序。它提供了一系列丰富的组件，包括表格、面板、窗口、菜单等，使得开发者能够轻松地创建功能强大的用户界面。在"Ext JS实例 学生信息管理...