Extjs4.2 gridPanel中的Store数据远程获取

var modelName = 'model';
Ext.define(modelName,{
extend : "Ext.data.Model",
fields : ["id","code", "name"]
});
var store = Ext.create("Ext.data.Store", {
autoLoad : false,
model : modelName,
data : [],
pageSize : 20,
proxy : {
type : "ajax",//异步加载
actionMethods : {
read : "POST"
},
url : me.URL("/Home/xxxxx/xxxx"),
reader : {
root : 'data'
},
},
listeners : {
beforeload : function(store, operation, opts) {
store.proxy.extraParams = me.getQueryParam();
},
load : function(store, records, successful, opts) {
if (successful){
//成功会自动填充数据,可以不做操作
}
}
}
});

说明如下:

autoLoad 是否自动加载数据,选择false后你需要去手动的刷新,可以调用Ext.getCmp(“pagingToolbar”).doRefresh();
pagingToolbar是专门用来生成分页组件的,可以移步到文档查看
中文4.X文档地址:http://extjs-doc-cn.github.io/ext4api/

autoLoad 是否自动加载数据,选择false后你需要去手动的刷新,可以调用Ext.getCmp(“pagingToolbar”).doRefresh();

pagingToolbar是专门用来生成分页组件的,是放到grid中的bbar字段下的

model就是我们定义的模型数据了,就像java的bean一样

data []表示获取的json数据都会包裹到data数组中

Proxy中

ajax: web开发过程中，与服务器端交互的技术最常用的就是Ajax了。采用异步的方式从服务器获取数据

主要说下reader是如何处理得到的数据,里面可以定义type 获取的数据类型,一般为json,

root是根对象,

listener就是监听了,我们定义了加载之前和加载后的操作,beforeload用于加载之前

store.proxy.extraParams是用来获取额外需要传递的参数,类型是数组,比如:{queryKey :name},当我们结合查询的时候就比较好用