`
fastwind
  • 浏览: 325228 次
  • 性别: Icon_minigender_1
  • 来自: 天津
社区版块
存档分类
最新评论

Ext.data.Store

阅读更多

 

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, String/RegExp value, [Number startIndex], [Boolean anyMatch], [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, String/RegExp value, [Boolean anyMatch], [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, Ext.data.Record[] records, Object options )
loadexception : ()
metachange : ( Store this, Object meta )
remove : ( Store this, Ext.data.Record record, Number index )
update : ( Store this, Ext.data.Record record, 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: 'name', mapping: 'name'},
  ...{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.Store的基本用法

    在创建完`Ext.data.Store`实例后,执行`store.load()`方法会触发数据转换的过程。`MemoryProxy`从内存中读取原始数据,`ArrayReader`则负责将这些数据转换为`PersonRecord`实例,最后这些实例会被存储在`store`中。...

    Ext3.2的Ext.data.Store类和Ext.Ajax类的实际运用

    环境:Window XP Sp2、Tomcat 6.0、...关于Ext.data.Store类,我们可以看出:该框架提供了客户端缓存的功能--这对于我们框架系统是非常有帮助的。本示例代码注释非常详细。 阅读对象:需要使用Ext框架进行Web开发的人员

    Ext.data.Store 读取XML属性值

    在处理数据时,`Ext.data.Store`是一个至关重要的组件,它用于存储和管理数据,可以与各种数据源进行交互。当我们需要从XML文档中提取数据并加载到`Store`时,就涉及到`Ext.data.reader.Xml`。这篇博客文章《Ext....

    Extjs 继承Ext.data.Store不起作用原因分析及解决

    关于这个原因有很多种,我只说下我遇到的 我这样 写Store来复用的 代码如下: DocStore = Ext.extend(Ext.data.Store,{ initComponent:function(){ this.proxy = new Ext.data.HttpProxy({url:this.url}); this....

    Ext.Store的获取方法

    store.load(); ``` 然后通过`store`变量来访问和操作Store。但在使用`extend`进行类继承时,可能会将Store的定义放在一个新的组件内,例如一个ComboBox: ```javascript Leangle.form.combo.ColorComboBox = Ext....

    Ext.DataView 图片列表显示

    this.store.reload(); }; var dataview = new Ext.DataView({ store: store, tpl : tpl, id: 'phones', itemSelector: 'li.phone', overClass : 'phone-hover', singleSelect: true, multiSelect : ...

    Extjs4.0设置Ext.data.Store传参的请求方式(默认为GET)

    代码如下: var Store = Ext.create(‘Ext.data.Store’, { pageSize: pageSize, model: ‘Ext.data.Model名称’, autoLoad: false, proxy: { type: ‘ajax’, url: ‘请求路径’, getMethod: function(){ return ...

    extjs中Ext.Panel和TreePanel 组件动态加载本地页面数据

    store: Ext.create('Ext.data.Store', { fields: ['name', 'value'], proxy: { type: 'ajax', url: 'data.json', // 本地数据文件路径 reader: { type: 'json', rootProperty: 'items' } }, autoLoad: ...

    Ext.data专题

    它定义了一系列的核心概念,包括 **Store**、**Reader** 和 **Proxy**,这些都是Ext.data的核心组成部分。通过这些概念,开发者能够轻松地管理应用程序中的数据流。 - **Store**:负责存储数据并提供一系列API来...

    EXT核心API详解

    35、Ext.data.Store类 …………………… 28 36、Ext.data.GroupingStore类 ………… 32 37、Ext.data.SimpleStore类 ………… 34 38、Ext.data.Tree类 …………………… 34 39、Ext.data.Node类 ………………… 34 ...

    可编辑表格Ext.grid.EditorGridPanel

    var store = new Ext.data.Store({ // ... }); // 定义列模型 var cm = new Ext.grid.ColumnModel([ {header: 'Name', width: 200, dataIndex: 'name', editor: new Ext.form.TextField()}, {header: 'Age', ...

    ext-tree.rar_ext_ext tr_ext tre_ext.tr_ext.tree

    3. **数据存储**:创建一个数据存储(Ext.data.Store),并配置其URL以连接到后端服务,用于获取或更新数据。 4. **右键菜单**:实现右键菜单(Ext.menu.Menu),定义菜单项,绑定点击事件处理函数。 5. **事件...

    Ext.grid.GridPanel属性祥解

    5. **reconfigure(Ext.data.Store store, Ext.grid.ColumnModel colModel)** - 说明:使用新的数据集和列模型重新配置表格。 - 示例:`reconfigure(new Ext.data.JsonStore(...), new Ext.grid.ColumnModel([...])...

    ext 基本知识-store-proxy-reader-ext-connection-实例

    总结起来,本篇内容涵盖了ExtJS中的核心数据组件,包括Ext.data.Connection的使用、Ext.data.Record的创建与操作、Ext.data.Store的配置以及数据交互的Proxy和Reader机制。这些知识是构建基于ExtJS的异步数据驱动...

    extjs帮助文档

    - `Ext.data.Store.remove(record)`:移除记录。 #### 三十六、Ext.data.GroupingStore类(第32页) - **概述**:Ext.data.GroupingStore类实现了分组数据存储。 - **常用方法**: - `new Ext.data.GroupingStore...

    extJs 2.1学习笔记

    6. Ext.data.Store篇 10 7. Ext.data.JsonReader篇一 12 8. Ext.data.JsonReader篇二 15 9. Ext.data.HttpProxy篇 19 10. Ext.data.Connection篇一 20 11. Ext.data.Connection篇二 24 12. Ext.Updater篇一 26 13. ...

    ExtJS入门教程(超级详细)

    35、Ext.data.Store类 …………………… 28 36、Ext.data.GroupingStore类 ………… 32 37、Ext.data.SimpleStore类 ………… 34 38、Ext.data.Tree类 …………………… 34 39、Ext.data.Node类 ………………… 34 ...

    Ext4.0 动态修改ComboBox选择项(本地模式)

    调用`loadData`或`refresh`方法: ```javascript comboBox.getStore().load(); // 或 comboBox.refresh(); ``` 4. **监听事件**: 为了响应用户的选择变化,可以监听ComboBox的`select`事件: ```javascript...

Global site tag (gtag.js) - Google Analytics