EXT核心API详解(十一)_Ext.data.Store/GroupingStore/JsonStore/
转自 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(); (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |