EXT核心API详解(十一)_Ext.data.Store/GroupingStore/JsonStore/SimpleStore

前端之家收集整理的这篇文章主要介绍了EXT核心API详解(十一)_Ext.data.Store/GroupingStore/JsonStore/SimpleStore前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

转自

http://blog.163.com/wangying110166/blog/static/315014682009018112821365/

Ext.data.Store

store是一个为Ext器件提供record对象的存储容器,行为和属性都很象数据表

方法:不列举继承来的方法

Store( Object config )

构造,config定义为{

autoLoad : Boolean/Object,//自动载入

baseParams : Object,//只有使用httpproxy时才有意义

data : Array,//数据

proxy : Ext.data.DataProxy,//数据代理

pruneModifiedRecords : boolean,//清除修改信息

reader : Ext.data.Reader,//数据读取器

remoteSort : boolean,//远程排序?

sortInfo : Object,//{field: "fieldName",direction: "ASC|DESC"}这样的排序对象

url : String,//利用url构造HttpProxy

}

add( Ext.data.Record[] records ) : void

增加记录records 到store

addSorted( Ext.data.Record record ) : void

增加record到store并排序(仅本地排序时有用)

clearFilter( Boolean suppressEvent ) : void

清除过滤器

collect( String dataIndex,[Boolean allowNull],[Boolean bypassFilter] ) : Array

收集由dataIndex指定字段的惟一值

commitChanges() : void

提交Store所有的变更,会引发Update事件

filter( String field,String/RegExp value,[Boolean anyMatch],[Boolean caseSensitive] ) : void

设定过滤器

field:String //字段名

value:String //RegExp 如果是字符器,检查field是否以value开始,如果是正则,检查是否匹配

anyMatch:Boolean //匹配任何部分而不仅令是开始

caseSensitive:Boolean //大小写敏感?

filterBy( Function fn,[Object scope] ) : void

更强悍的过滤方法.fn接收两个参数record和id

find( String property,[Number startIndex],[Boolean caseSensitive] ) : Number

找到符合条件的第一条记录,参数同filter

findBy( Function fn,[Object scope],[Number startIndex] ) : Number

参见filterBy

getAt( Number index ) : Ext.data.Record

getById( String id ) : Ext.data.Record

依充号/id得到record对象

getCount() : void

得到记录数

getModifiedRecords() : Ext.data.Record[]

得到修改过的记录集

getRange( [Number startIndex],[Number endIndex] ) : Ext.data.Record[]

得到指定范围的记录集合

getSortState() : void

得到排序状态:显然不是void而是返回一个排序对象,同sortInfo一样的结构{field: "fieldName",direction: "ASC|DESC"}

getTotalCount() : void

这个对于翻页信息还是很有用的

indexOf( Ext.data.Record record ) : Number

indexOfId( String id ) : Number

由记录或id得到序号

insert( Number index,Ext.data.Record[] records ) : void

在指定的位置插入记录,并引发add事件

isFiltered() : Boolean

当前设置了过滤器则返回真

load( Object options ) : void

由指定的Proxy使用指定的reader读取远程数据

options定义为

{

params :Object,//请求url需要附加的参数

callback :Function//回叫方法,接收三个参数

//r : Ext.data.Record[] //返回的record数组

//options: Options load方法传入的options

//success: Boolean //成功

scope :Object,//范围.默认是store本身

add :Boolean 追加还是更新

}

loadData( Object data,[Boolean append] ) : void

用法比load简单一点,目的是一样的,只是这次数据由本地读取

query( String field,[Boolean caseSensitive] ) : MixedCollection

queryBy( Function fn,[Object scope] ) : MixedCollection

查询,参数和find类似,但返回所有符合条件的record,而不是第一个符合条件记录的序号

rejectChanges() : void

放弃所有的变更

reload( [Object options] ) : void

重新载入,相当于 load(options,false),如果连options都没有传入,则取最后一次load时使用的参数

remove( Ext.data.Record record ) : void

移除指定记录

removeAll() : void

移除所有记录

setDefaultSort( String fieldName,[String dir] ) : void

设置默认排序规则

sort( String fieldName,[String dir] ) : void

排序

sum( String property,Number start,Number end ) : Number

对property字段由start开始到end求和

事件列表

add : ( Store this,Ext.data.Record[] records,Number index )

beforeload : ( Store this,Object options )

clear : ( Store this )

datachanged : ( Store this )

load : ( Store this,Object options )

loadexception : ()

Metachange : ( Store this,Object Meta. )

remove : ( Store this,Ext.data.Record record,Number index )

update : ( Store this,String operation )

看名字都很简单,参数也不复杂,略过

用例

//得到远程json对象

//其中jsoncallback.js内容

//{ 'results': 2,'rows': [

// { 'id': 1,'name': 'Bill',occupation: 'Gardener' },

// { 'id': 2,'name': 'Ben',occupation: 'Horticulturalist' } ]

//}

//定义proxy

var proxy=new Ext.data.HttpProxy(...{url:'jsoncallback.js'});

//定义reader

var reader=new Ext.data.JsonReader(

...{

totalProperty: "results",//totalRecords属性由json.results得到

root: "rows",//构造元数据的数组由json.rows得到

id: "id" //id由json.id得到

},[

...{name: 'name',mapping: 'name'},

...{name: 'occupation'} //如果name与mapping同名,可以省略mapping

]

)

//构建Store

var store=new Ext.data.Store(...{

proxy:proxy,

reader:reader

});

//载入

store.load();

示例2

//得到远程xml文件

//其中xml文件内容

<?xml version="1.0" encoding="utf-8" ?>

<dataset>

<results>2</results>

<row>

<id>1</id>

<name>Bill</name>

<occupation>Gardener</occupation>

</row>

<row>

<id>2</id>

<name>Ben</name>

<occupation>Horticulturalist</occupation>

</row>

</dataset>

var proxy=new Ext.data.HttpProxy(...{url:'datasource.xml'});

var reader = new Ext.data.XmlReader(...{

totalRecords: "results",

record: "row",

id: "id"

},

...{name: 'occupation'}

]);

var store=new Ext.data.Store(...{

proxy:proxy,

reader:reader

});

store.load();

示例3

//从本地数组得到

var arr=[ [1,'Bill','Gardener'],[2,'Ben','Horticulturalist'] ];

var reader = new Ext.data.ArrayReader(

{id: 0},

[

{name: 'name',mapping: 1},

{name: 'occupation',mapping: 2}

]);

var store=new Ext.data.Store({

reader:reader

});

store.loadData(arr);

Ext.data.GroupingStore

继承自Ext.data.Store,为Store增加了分组功能.其它用法与Store一致,惟一需要注意的是使用GroupingStore时必须指定sortInfo信息

增加了配置属性

groupField : String//用于分组的字段

groupOnSort : Boolean//如果为真,将依排序字段重新分组,默认为假

remoteGroup : Boolean//远程排序

当然也会多一个group方法

groupBy( String field,[Boolean forceRegroup] ) : void

顾名思义都是重新排序用的

下面是个简单的示例

var arr=[ [1,'本','拉登'],'笨',[3,'拉灯'] ];

var reader = new Ext.data.ArrayReader(

...{id: 0},

[

...{name: 'name',

...{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",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,

...{ 'id': 2,occupation: 'Horticulturalist' }

]},

autoLoad:true,'occupation']

})

//目前请先略过gridpanel,以后再说

var grid = new Ext.grid.GridPanel(...{

ds: store,

columns: [

...{header: "id",width: 200,dataIndex: 'id'},

...{header: "name",height:350,

width:620,

title:'Array Grid',

renderTo: 'Div_GridPanel'

});

Ext.data.SimpleStore

从数组对象更方便的创建Store对象,

var store=new Ext.data.JsonStore(...{

data:[

[1,'Horticulturalist']

],

fields:[...{name: 'name',...{name:'occupation',mapping:2}]

})

var grid = new Ext.grid.GridPanel(...{

ds: store,

renderTo: 'Div_GridPanel'

});

比如有如下類:

public class CountryBase

{

private int _cid;

private string _country;

private string _region;

private string _location;

private string _delflag;

public int Cid

{

get { return _cid; }

set { _cid = value; }

}

public string Country

{

get { return _country; }

set { _country = value; }

}

public string Region

{

get { return _region; }

set { _region = value; }

}

public string Location

{

get { return _location; }

set { _location = value; }

}

public string DelFlag

{

get { return _delflag; }

set { _delflag = value; }

}

}

那么

List<CurrencyBase> CurrencyBaseContainer = new List<CurrencyBase>();

//對封裝了的成员变量进行赋值

CurrencyBase CurrencyBase = new CurrencyBase();

CurrencyBase .Cid = Convert.ToInt32(**);

CurrencyBase .Curr = Convert.ToString(**);

CurrencyBase .EntyCurr = Convert.ToString(**);

CurrencyBase .ExchRate = Convert.ToDouble(**);

CurrencyBase .CYear = Convert.ToString(**);

CurrencyBase .Remark = Convert.ToString(**);

//

CurrencyBaseContainer.Add(CurrencyBase );

最后

StringBuilder jsonText = new StringBuilder(JavaScriptConvert.SerializeObject(CurrencyBaseContainer));

return jsonText.ToString();

猜你在找的Json相关文章