Ext.data-GroupingStore/JsonStore/SimpleStore
来源:互联网 发布:tensorflow 分割 编辑:程序博客网 时间:2024/05/30 23:28
Ext.data.GroupingStore
继承自Ext.data.Store,为Store增加了分组功能.其它用法与Store一致,惟一需要注意的是使用GroupingStore时必须指定sortInfo信息
增加了配置属性
groupField : String//用于分组的字段
groupOnSort : Boolean//如果为真,将依排序字段重新分组,默认为假
remoteGroup : Boolean//远程排序
当然也会多一个group方法
groupBy( String field, [Boolean forceRegroup] ) : void
顾名思义都是重新排序用的
下面是个简单的示例
Ext.data.JsonStore
也是Store子类,目标是更方便的使用json对象做数据源
构造中多了fields,root,用法如下例所示
Ext.data.SimpleStore
从数组对象更方便的创建Store对象,
例
继承自Ext.data.Store,为Store增加了分组功能.其它用法与Store一致,惟一需要注意的是使用GroupingStore时必须指定sortInfo信息
增加了配置属性
groupField : String//用于分组的字段
groupOnSort : Boolean//如果为真,将依排序字段重新分组,默认为假
remoteGroup : Boolean//远程排序
当然也会多一个group方法
groupBy( String field, [Boolean forceRegroup] ) : void
顾名思义都是重新排序用的
下面是个简单的示例
var arr=[ [1, '本', '拉登'], [2, '笨', '拉登'],[3, '笨', '拉灯'] ];
var reader = new Ext.data.ArrayReader(
{id: 0},
[
{name: 'name', mapping: 1},
{name: 'occupation', mapping: 2}
]);
var store=new Ext.data.GroupingStore({
reader:reader,
groupField:'name',
groupOnSort:true,
sortInfo:{field: 'occupation', direction: "ASC"} //使用GroupingStore时必须指定sortInfo信息
});
store.loadData(arr);
//GridPanel以后会讨论,这儿使用它是为了直观的表现GroupingStore
var grid = new Ext.grid.GridPanel({
ds: store,
columns: [
{header: "name", width: 20, sortable: true,dataIndex: 'name'},
{header: "occupation", width: 20,sortable: true, dataIndex: 'occupation'}
],
view: new Ext.grid.GroupingView({
forceFit:true,
groupTextTpl: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})'
}),
frame:true,
width: 700,
height: 450,
collapsible: true,
animCollapse: false,
title: 'Grouping Example',
renderTo: 'Div_GridPanel'
});
var reader = new Ext.data.ArrayReader(
{id: 0},
[
{name: 'name', mapping: 1},
{name: 'occupation', mapping: 2}
]);
var store=new Ext.data.GroupingStore({
reader:reader,
groupField:'name',
groupOnSort:true,
sortInfo:{field: 'occupation', direction: "ASC"} //使用GroupingStore时必须指定sortInfo信息
});
store.loadData(arr);
//GridPanel以后会讨论,这儿使用它是为了直观的表现GroupingStore
var grid = new Ext.grid.GridPanel({
ds: store,
columns: [
{header: "name", width: 20, sortable: true,dataIndex: 'name'},
{header: "occupation", width: 20,sortable: true, dataIndex: 'occupation'}
],
view: new Ext.grid.GroupingView({
forceFit:true,
groupTextTpl: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})'
}),
frame:true,
width: 700,
height: 450,
collapsible: true,
animCollapse: false,
title: 'Grouping Example',
renderTo: 'Div_GridPanel'
});
Ext.data.JsonStore
也是Store子类,目标是更方便的使用json对象做数据源
构造中多了fields,root,用法如下例所示
/*
这是使用远程对象,返回内容与下面本地对象的data一致
var store=new Ext.data.JsonStore({
url:'jsoncallback.js',
root:'rows',
fields:['id','name','occupation']
});
store.load();
*/
var store=new Ext.data.JsonStore({
data:{ 'results': 2, 'rows': [
{ 'id': 1, 'name': 'Bill', occupation: 'Gardener' },
{ 'id': 2, 'name': 'Ben', occupation: 'Horticulturalist' }
]},
autoLoad:true,
root:'rows',
fields:['id','name','occupation']
})
//目前请先略过gridpanel,以后再说
var grid = new Ext.grid.GridPanel({
ds: store,
columns: [
{header: "id", width: 200, sortable: true,dataIndex: 'id'},
{header: "name", width: 200, sortable: true,dataIndex: 'name'},
{header: "occupation", width: 200,sortable: true, dataIndex: 'occupation'}
],height:350,
width:620,
title:'Array Grid',
renderTo: 'Div_GridPanel'
});
这是使用远程对象,返回内容与下面本地对象的data一致
var store=new Ext.data.JsonStore({
url:'jsoncallback.js',
root:'rows',
fields:['id','name','occupation']
});
store.load();
*/
var store=new Ext.data.JsonStore({
data:{ 'results': 2, 'rows': [
{ 'id': 1, 'name': 'Bill', occupation: 'Gardener' },
{ 'id': 2, 'name': 'Ben', occupation: 'Horticulturalist' }
]},
autoLoad:true,
root:'rows',
fields:['id','name','occupation']
})
//目前请先略过gridpanel,以后再说
var grid = new Ext.grid.GridPanel({
ds: store,
columns: [
{header: "id", width: 200, sortable: true,dataIndex: 'id'},
{header: "name", width: 200, sortable: true,dataIndex: 'name'},
{header: "occupation", width: 200,sortable: true, dataIndex: 'occupation'}
],height:350,
width:620,
title:'Array Grid',
renderTo: 'Div_GridPanel'
});
Ext.data.SimpleStore
从数组对象更方便的创建Store对象,
例
var store=new Ext.data.JsonStore({
data:[
[1, 'Bill', 'Gardener'], [2, 'Ben', 'Horticulturalist']
],
autoLoad:true,
fields:[{name: 'name', mapping: 1},{name:'occupation',mapping:2}]
})
var grid = new Ext.grid.GridPanel({
ds: store,
columns: [
{header: "name", width: 200, sortable: true,dataIndex: 'name'},
{header: "occupation", width: 200,sortable: true, dataIndex: 'occupation'}
],height:350,
width:620,
renderTo: 'Div_GridPanel'
});
data:[
[1, 'Bill', 'Gardener'], [2, 'Ben', 'Horticulturalist']
],
autoLoad:true,
fields:[{name: 'name', mapping: 1},{name:'occupation',mapping:2}]
})
var grid = new Ext.grid.GridPanel({
ds: store,
columns: [
{header: "name", width: 200, sortable: true,dataIndex: 'name'},
{header: "occupation", width: 200,sortable: true, dataIndex: 'occupation'}
],height:350,
width:620,
renderTo: 'Div_GridPanel'
});
- Ext.data-GroupingStore/JsonStore/SimpleStore
- Ext.data-GroupingStore/JsonStore/SimpleStore
- Ext.data-GroupingStore/ JsonStore/ SimpleStore
- Ext.data-GroupingStore/ JsonStore/ SimpleStore
- Ext.data-GroupingStore/JsonStore/SimpleStore
- Ext.data-GroupingStore/JsonStore/SimpleStore
- [转载]Ext.data-GroupingStore/JsonStore/SimpleStore
- Ext.data.Store/GroupingStore/JsonStore/SimpleStore
- Ext.data.Store/GroupingStore/JsonStore/SimpleStore
- EXT核心API详解Ext.data(十二)-GroupingStore/JsonStore/SimpleStore
- [转载]EXT核心API详解Ext.data(十二)-GroupingStore/JsonStore/SimpleStore
- EXT核心API详解Ext.data(十二)-GroupingStore/JsonStore/SimpleStore javascript
- EXT核心API详解(十一)_Ext.data.Store/GroupingStore/JsonStore/SimpleStore
- EXT核心API详解(十二)--GroupingStore/JsonStore/SimpleStore
- ExtJs中ArrayStore、SimpleStore、JsonStore、GroupingStore
- Ext.data.GroupingStore详解
- Ext.data.GroupingStore详解
- 【读】Ext.data.JsonStore
- 实时操作系统与通用操作系统的一些比较
- 关于UpdatePanel控件的UpdateMode属性的探讨
- SQL 2000對text類型的處理(分類相加字串)
- select标签
- Qt/Embedded 中文處理實戰
- Ext.data-GroupingStore/JsonStore/SimpleStore
- option/options标签
- (转)FTP 操作
- errors标签
- PowerDesginer导出word报告
- 换种方式实现3级联动
- 从文本文件注册用户
- Ext.data-Tree/Node
- css layout