ExtJs中同一个URL构造多个Ext.data.JsonStore 转载

转载：原文http://www.tygbless.tk/?p=127

最近做项目一个页面需要向相同一个URL取一个对象的两种不同的属性集，用来在前台分别用两种不同的组件显示。因为查找的是同一个对象，而且一次就 能获得其两种属性集，如果分为两次请求，那样效率太低了。那现在就需要在一次请求中返回所有的数据，然后再构造成两个不同的JsonStore以便两个不 同的Ext组件进行加载。

那如何完成这一目标呢？首先我的思路是这样的：
(1)用Ext.Ajax.request()去后台取数据，如下所示：

Ext.Ajax.request({
        url:urlstr,//后台取数据的地址
        success:function(response){
            var responseJson = Ext.util.JSON.decode(response.responseText);
            if(responseJson.success)
            {
                store1.loadData(responseJson);//将后面(3)中的store1、store2的定义放在
                store2.loadData(responseJson);//Ext.Ajax.request之前
            }
        },
        failure:function(response){
        }
});

(2)后台返回json格式的数据，如

{success:true,root1:[{name:’name’,type:’type’},{name:’name1’,type:’type1’}],root2:[{color:’red’,number:3},{color:’black’,number:4}]};

(3)在前台构造两个Ext.data.JsonStore，如下所示：

var store1 = new Ext.data.JsonStore({
        fields:['name','type'],
        root:’root1′
});
var store2 = new Ext.data.JsonStore({
        fields:['color',’number'],
        root:’root2′
});

(4)在前台将后台返回的json数据转换成json对象（第(1)步中的responseJson 对象），然后使用Ext.data.JsonStore对象的loadData()方法加载json类型的数据即可，这样就构造两个JsonStore 了，以便其他组件配置项‘store’使用。

store1.loadData(responseJson);//加载json类型的数据