`
编程足球
  • 浏览: 257729 次
  • 性别: Icon_minigender_1
  • 来自: 福州
社区版块
存档分类
最新评论

Ext.data.Store 小细节收集

    博客分类:
  • Ext
 
阅读更多
1. 常用的初始化方法
新建一个store一般的方法如下(一般从服务器获得数据)
var storeRecord = new Ext.data.Record.create(
	[   
		{name: 'id',   	type: 'string',		mapping:'projectId'},  
		{name: 'name',	type: 'string',  	mapping:'projectName'},  
		{name: 'type', 	type: 'string',		mapping:'type'}
 	]
);
var configProjectAll = new Ext.data.Store({
	proxy : new Ext.data.HttpProxy({  //  加载的远程url
				url : 'findConfigProjectAll.action'
			}),
	autoLoad : 	false,  // 是否自动加载   一般设置false 需要时候在加载
	sortInfo : {field: 'name', direction: 'ASC'},//DESC  排序依据和升or降
	reader   : 	new Ext.data.JsonReader({
						totalProperty : 'totalProperty',
						root : 'root',  // 服务器返回json的根信息
						id :'projectId' // 值为对应的mapping的值
					},
					storeRecord   // 要加载的数据
				)
});


2. 加载数据

store创建好后,需要调用load()函数加载数据,
加载成功后才能对store中的数据进行操作。
load()调用的完整过程如下面的代码所示。
store.load({
	//	params是在store加载时发送的附加参数。
    params: {start:0,limit:20},
	
	//	records参数表示获得的数据(是一个数组)
	//	options表示执行load()时传递的参数 
	//	success表示是否加载成功(true or false)
	//  上面参数具体的用法可以通过ff进行查看,一目了然
    callback: function(records, options, success){
        //  可以通过参数sucess判断是否成功加载
    },
	
	//	用来指定回调函数执行时的作用域。
    scope: store,//  一般不用
	
	//Add为true时,load()得到的数据会添加在原来的store数据的末尾,
    //否则会先清除之前的数据,再将得到的数据添加到store中。
    add: true  //  一般不用
});






3. 后台要返回对应的json格式的数据
{
	"root":
		[
			{
				"processVersion":2,
				"projectId":84,
				"projectName":"a",
				"projectVersion":" ",
				"type":1
			},{
				"processVersion":2,
				"projectId":85,
				"projectName":"b",
				"projectVersion":"10.1",
				"type":1
			},{
				"processVersion":2,
				"projectId":86,
				"projectName":"c",
				"projectVersion":"10.2",
				"type":1
			}
		],
        "success":true,
	"totalProperty":3
}


Store会自动根据传递来的数据进行加载
根据
{name: 'id',   	type: 'string',		mapping:'projectId'},

进行自动匹配,多余的就不匹配.丢弃


2. ext2.2 和 ext3.2 返回值success区别
Ext.data.Store 加载时候
ext2.2 不用管前台放回的是false还是true
ext3.2 如果前台放回success false 无法加载数据  一定要是true

3. stroe加载数据,传递额外信息.并获取
比如:加载数据的同时要向客户端传递查询的sql语句的实现



store.load({
    	params:{
    		start:0, 
    		limit:pageSize
    	},
    	callback: function(records, options, success){
    		sql = this.reader.jsonData.sql; // sql 就是附加的json信息
    	}
    });



4. Store遍历
store.each(function(record){
	var value = record.get(name);//Ext.data.Record.create  对应的name的值
});

  • 大小: 48.6 KB
  • 大小: 28.2 KB
分享到:
评论

相关推荐

    Ext.data.Store的基本用法

    ### Ext.data.Store的基本用法详解 #### 一、Ext.data.Store简介 `Ext.data.Store`是ExtJS框架中用于管理数据的核心组件之一。它主要负责数据的存储、加载、更新等操作,并且提供了多种方法来方便地处理这些数据。...

    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的获取方法

    var store = new Ext.data.JsonStore({ // store configurations }); store.load(); ``` 然后通过`store`变量来访问和操作Store。但在使用`extend`进行类继承时,可能会将Store的定义放在一个新的组件内,例如一个...

    Ext.data专题

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

    Ext.DataView 图片列表显示

    store = new Ext.data.Store({ proxy:proxy, reader:reader }); //尾 分页 var pagebar = new Ext.PagingToolbar({ store:store, pageSize:limit, displayInfo:true, displayMsg:'本页显示第{0}条到第{...

    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: ...

    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 ...

    可编辑表格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核心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.GridPanel属性祥解

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

    ext-tree.rar_ext_ext tr_ext tre_ext.tr_ext.tree

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

    ExtJs选中var editor = new Ext.ux.grid.RowEditor详解

    data: Ext.encode(record.data), // 将数据编码成字符串形式 id: record.id }, success: function() { alert(10); } }); grid.getView().refresh(); // 刷新视图 }); ``` - `store` 是 `GridPanel` 绑定...

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

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

    [Ext 3.x + Ext 2.x] 下拉树 Ext.ux.ComboBoxTree

    1. `store`:定义数据存储对象,可以是Ext.data.TreeStore,用于保存树形结构的数据。 2. `displayField`:指定显示在下拉框中的字段,通常是从树节点数据中提取的属性。 3. `valueField`:选择后记录的值,通常是树...

    ExtJs学习资料28-Ext.data.JsonStore数据存储器.doc

    var store = new Ext.data.JsonStore({ url: 'jsonDataPerson.asp', root: 'rows', fields: ['name', 'age', 'sex'] }); store.load(); grid.store = store; ``` 这里创建了一个JsonStore,指定数据来源URL和...

    深入浅出Ext_JS:数据存储与传输

    Ext.data是一个专门处理数据的模块,它包含了store、reader和proxy等组件,这些组件协同工作以确保数据在前端和后端之间高效、灵活地流动。Store是数据容器,负责存储和管理数据;Reader则负责解析从服务器接收到的...

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

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

    extjs帮助文档

    - `Ext.data.ScriptTagProxy.save(store, operation, successCallback, failureCallback)`:保存数据。 #### 三十一、Ext.data.DataReader类(第26页) - **概述**:Ext.data.DataReader类用于解析原始数据并将其...

Global site tag (gtag.js) - Google Analytics