有一些需求
如:
1.某个字段的内容的可选值是: 男,女,不男不女,雌雄同体, 要求排序的顺序是 男>女>不男不女>雌雄同体
2.中文排序
只需要对相应的record的field设置里面添加sortType
,
代码如下:
// current sort after sort we want
// +-+------+ +-+------+
// |1|First | |1|First |
// |2|Last | |3|Second|
// |3|Second| |2|Last |
// +-+------+ +-+------+
{name:'xxx',dataIndex:'xxxxxx',
sortType: function(value) {
switch (value.toLowerCase()) // native toLowerCase():
{
case 'first': return 1;
case 'second': return 2;
default: return 3;
}
}
}
也可以把它加入到Ext.data.SortTypes
,然后record里面直接指定sortType:'defiendFnName'
还有一些需求
如:
1.一个文件管理的Grid,要求排序的时候,文件夹永远在顶部
2.一个显示成功率的Grid,要求成功数+失败数=0的数据,不参与排序,永远在底部
ExtJs本身并没有暴露这个接口,所以我们只能自己重写,如下代码
var store = new Ext.data.JsonStore({
root:'data',
fields:[
'name',
{name:'sucCount',type:'int'},
{name:'failCount',type:'int'},
{name:'sucRate',type:'float'},
{name:'isValidateTest',type:'boolean'},
{name:'statType',type:'int'},
'testLogIds','bsc','msc','sgsn'
],
sortInfo:{field: 'sucRate', direction: 'ASC'},
//排序规则
sortData:function(f, direction){
direction = direction || 'ASC';
var dir = direction == 'ASC' ? 1 : -1;
var st = this.fields.get(f).sortType;
//关键地方,重写排序排序规则
var fn = function(r1, r2){
if(!r1.get('isValidateTest')||!r2.get('isValidateTest')){
//无效数据永远在下面
return !r1.get('isValidateTest') ? dir : -dir;
}else{
var v1 = st(r1.data[f]), v2 = st(r2.data[f]);
return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
}
};
this.data.sort(direction, fn);
if(this.snapshot && this.snapshot != this.data){
this.snapshot.sort(direction, fn);
}
}
});
分享到:
相关推荐
总结起来,解决EXTJS Grid中文排序问题主要涉及到自定义排序函数和利用localeCompare方法。通过这种方式,我们可以确保EXTJS Grid在处理中文数据时能正确排序,提供更好的用户体验。在实际开发中,可能还需要考虑...
1. **EXTJS Grid组件**:EXTJS Grid是EXTJS的核心组件之一,它允许开发者创建可分页、可排序、可过滤的数据表格。Grid可以与各种数据源(如JSON、XML或内存中的数组)配合使用,并通过Store对象进行数据的加载和管理...
EXTJS Grid是一款强大的数据展示组件,广泛应用于Web应用开发中,尤其在数据密集型界面设计时,EXTJS Grid以其高效的数据加载、灵活的分页、排序、过滤和自定义功能而受到开发者青睐。本总结例子将深入探讨EXTJS ...
EXTJS Grid提供了丰富的功能,包括分页、排序、过滤、编辑等,使得用户可以高效地管理和处理数据。EXTJS 4.2.1是EXTJS的一个稳定版本,它包含了多项改进和新特性,以提升用户体验和开发者的工作效率。 在EXTJS ...
ExtJS Grid是Sencha ExtJS框架中的一个核心组件,它用于构建数据驱动的表格视图。Grid组件在Web应用中广泛使用,因为它提供了强大的数据展示、排序、分页、筛选和编辑功能。以下是对`ExtJS Grid`示例代码的详细解析...
7. Customization(自定义):除了基本的多表头功能,还可以通过扩展和定制实现更复杂的需求,例如自定义排序、过滤和分组逻辑。 在"groupheader"这个文件中,可能包含了实现多表头功能的示例代码、配置文件或样式...
若需更多自定义排序逻辑,可以监听`sortchange`事件,然后在后端处理排序逻辑。 6. **事件处理**:Grid提供多种事件,如`itemclick`、`itemdblclick`、`beforeedit`、`afteredit`等,可以用于响应用户操作。通过...
ExtJS Grid 分页是Web应用中数据展示的重要组成部分,它允许用户高效地浏览大量数据而无需一次性加载所有记录。在本文中,我们将深入探讨ExtJS Grid的分页功能及其实现方式。 首先,ExtJS Grid是一种强大的...
- **Grid Panel**:是ExtJS中的一个核心组件,用于显示二维数据,可以进行排序、筛选、分页等操作。 - **Store**:存储Grid的数据,可以是从服务器获取的JSON、XML或Array格式的数据,也可以是本地数据。 - **...
EXTJS Grid支持自定义表头菜单,用户可以通过右键点击表头来选择排序、隐藏列等操作。开发者可以自定义这个菜单,添加更多功能,如列过滤、列锁定等。 6. 数据源绑定: EXTJS Grid的数据通常来源于Store,一个数据...
此外,还可以添加额外的功能,如排序、锁定列、自定义渲染等。 5. **增删改功能**: 在Grid中实现编辑功能通常涉及行内编辑或弹出编辑窗口。ExtJS4提供了多种编辑模式,如CellEditing、RowEditing等。增删改操作...
本文将深入探讨如何利用ExtJs的相关控件类来实现一个自定义的Grid列表导出功能,同时保持列表的样式。 首先,理解ExtJs Grid的基本结构至关重要。Grid是一个可配置的组件,用于显示数据集并提供交互式功能,如排序...
在ExtJs中,Grid组件是展示大量数据的重要工具,它提供了丰富的功能,包括排序、分页、筛选等。当需要将Grid中的数据导出到Excel时,可以采用两种方法,这些方法在ExtJs 4.2版本中已经得到很好的支持。 **方法一:...
Grid Panel是ExtJS中的一个核心组件,它允许开发者以表格的形式展示大量数据,并提供多种交互功能,如排序、分页、筛选等。在基于ExtJS Form表单的项目中,Grid Panel通常用于显示和编辑由Form表单收集或处理的数据...
- Grid的顶部通常包含一个工具栏,可以动态添加按钮或其他UI元素,提供搜索、排序或过滤等功能。这些功能可以通过`dockedItems`配置项实现。 6. **Autogrid.js可能的用途** - 文件名"Autogrid.js"暗示可能是一个...
ExtJS Grid是一款强大的JavaScript数据网格组件,常用于构建数据密集型Web应用,提供丰富的功能,如排序、分页、过滤、编辑等。在"Extjs Grid+asp.net+json Demo"中,我们将探讨如何结合ExtJS Grid、ASP.NET以及JSON...
Grid的列可自定义,包括列的类型(文本、数字、日期等)、宽度、可排序性、可编辑性等。通过配置列模板,可以显示复杂的格式化数据,如使用计算字段或链接。 4. **分页(Paging)** 对于大量数据,Grid支持分页...
在EXTjs中,grid组件是用于展示大量数据的常用组件,它可以提供灵活的布局、排序、筛选等功能。本篇将重点讲解如何在EXTjs中实现双层表头,以及通过提供的源代码`GridDoubleHeader.js`来理解其实现细节。 EXTjs的...
- `GridPanel` 是EXTJS中用于展示表格数据的组件,它可以灵活地处理大量数据,并提供排序、分页、过滤等功能。 - 在 `GridComboBox` 中,`GridPanel` 作为下拉菜单的内容,使用户能以表格形式查看和选择数据。 3....
在"ExtJS5学习之Grid与Grid之间的数据拖拽"这个主题中,我们将深入探讨如何实现这种交互功能,以及背后的机制和重要知识点。 首先,我们要了解ExtJS的Grid组件。Grid是一种可配置的表格视图,它可以显示大量的结构...