ExtJs4.1实现数据缓存

Ext.onReady(function () {

            Ext.define("ProvinceCity", {

                extend: "Ext.data.Model",

                fields: [

                { name: "ProvinceName", type: "string" },

                { name: "CityName", type: "string" }

                ]

            });

            var store = Ext.create("Ext.data.Store", {

                model: "ProvinceCity",

                //autoLoad: true,//进行手动加载

                proxy: {

                    type: "ajax",

                    url: "test2.aspx",

                    reader: {

                        type: "xml",

                        record: "Table"

                    }

                }

            });

            var data;

            var dataStore = new Array();

            store.load({

                scope: this,

                callback: function (records, operation, success) {

                    data = store.collect("ProvinceName"); //因为省份有重复的选项，要把其中重复的选项去掉

                    Ext.Array.each(data, function (item) {

                        dataStore.push({ 'ProvinceName': item });

                    });

                }

            });

            var store1 = Ext.create("Ext.data.Store", {

                fields: ["ProvinceName"],

                data: dataStore,

                proxy: {

                    type: "memory"

                }

            });

            var store2 = Ext.create("Ext.data.Store", {

                model: "ProvinceCity",

                proxy: {

                    type: "memory"

                }

            });

 

            Ext.create("Ext.form.Panel", {

                id: "form1",

                renderTo: Ext.getBody(),

                bodyPadding: 10,

                width: "auto",

                title: "Please Choose Province And City",

                layout: {

                    type: "hbox",

                    align: "left"

                },

                items: [

                        { xtype: "combobox", id: "provinceName", fieldLabel: "ProvinceName", store: store1, valueField: "ProvinceName", displayField: "ProvinceName", padding: 10, listeners: { "select": function (comboBox, record, index) {

                            var temp = store.queryBy(function (record, id) {

                                if (record.get("ProvinceName") == comboBox.getValue()) {

                                    return true;

                                }

                            });

                            store2.removeAll();

                            store2.add(temp.items);

                            Ext.getCmp("cityName").clearValue();

                            Ext.getCmp("cityName").bindStore(store2);

                        }

                        }

                        },

                        { xtype: "combobox", fieldLabel: "CityName", id: "cityName",  padding: 10, valueField: "ProvinceName", displayField: "CityName"}]

            });

        });