ext省市县级联下拉

做了个省市县级联下拉

/**  * Created by Sukla on 2017/7/28.  */ Ext.define('app.view.common.ssx.Ssx', {
    extend: 'Ext.container.Container',
    alias: 'widget.s-s-x',
    requires: [
        'app.store.Personnel'  ],
    viewModel: {
        data: {
            province: '',
            city: '',
            county: ''  }
    },
    items: [
        {
            xtype:'textfield',
            bind:{
                value:'{province}'+' '+'{city}'+' '+'{county}'  }
        },
        //{  // xtype:'label',  // bind:{  // text:'{city}'  // }  //},  //{  // xtype:'label',  // bind:{  // text:'{county}'  // }  //},  {
            xtype: "combobox",
            fieldLabel: "选择省份",
            name: "provincename",
            //id: "provincename",  //bind:'{province}',  labelAlign: "left",
            emptyText: "请选择省份",
            typeAhead: true,
            queryMode: "local",
            allowBlank: false,
            forceSelection: true,
            //store: {  // type: 'province'  //},  store: Ext.create("Ext.data.Store",
                {
                    proxy: {
                        type: 'ajax',
                        url: 'resources/data/province.json'  },
                    root: {
                        text: 'All',
                        id: 'all',
                        expanded: true  },
                    autoLoad: true  }),
            valueField: "key",
            displayField: "value",
            listeners: {
                'change': function (t, n, o, e) {
                    //alert(temp==null);  var rew=this.rawValue;
                    console.log(this.value);
                    var parent=this.ownerCt;
                    parent.getViewModel().set('province',rew);//设置model中的字段为选中的内容   var temp = n;
                    //Ext.getCmp("cityname").setDisabled(false);  //alert(n);  //alert(r.pop().get("key")); // if(temp==null){temp=n;}else{temp=n;}  this.nextSibling().reset();
                    this.nextSibling().nextSibling().reset();
                    var cityurl='resources/data/city'+temp+'.json';
                    console.log(cityurl)
                    city.proxy.url=cityurl;
                    city.load({
                        callback: function(records, options, success){
                            Ext.Msg.alert('info', '加载完毕');
                            console.log(temp)
                        },
                        //scope: store, //Scope用来指定回调函数执行时的作用域  //Add为true时，load()得到的数据会添加在原来的store数据的末尾，  //否则会先清除之前的数据，再将得到的数据添加到store中  add: false  });
                }
// , // 'change':function(t,n,o,e){ // alert('change'); // }  }
        },
        {
            xtype: "combobox",
            fieldLabel: "选择城市",
            name: "cityname",
            //bind:'{city}',  //id: "cityname",  queryMode: "local",
            //disabled:true,  triggerAction: "all",
            store:city=Ext.create("Ext.data.Store",
                    {
                        proxy: {
                            type: 'ajax',
                            url: 'resources/data/city.json'  },
                        root: {
                            text: 'All',
                            id: 'all',
                            expanded: true  },
                        autoLoad: false  }),
            //store: {  // type: 'city'  //},  //store: Ext.create("Ext.data.Store",  // {  // proxy: {  // type: 'ajax',  // url: 'resources/data/province.json'  // },  // root: {  // text: 'All',  // id: 'all',  // expanded: true  // },  // autoLoad: true  // }),  //store: Ext.create("Ext.data.ArrayStore",  // {  // fields: ["key", "value"],  // data: [["km", "昆明"], ["qj", "曲靖"], ["mz", "蒙自"]]  // }),  //multiSelect:true,  labelAlign: "left",
            emptyText: "请选择城市",
            typeAhead: true,
            valueField: "key",
            displayField: "value",
            forceSelection: true,
            defaultListConfig: {
                loadMask: false  },
            listeners: {
                'change': function (t, n, o, e) {
                    //alert(temp==null);  var rew=this.rawValue;
                    console.log(this.rawValue);
                    var parent=this.ownerCt;
                    parent.getViewModel().set('city',rew);
                    var temp1 = n?n:'';
                    //Ext.getCmp("cityname").setDisabled(false);  //alert(n);  //alert(r.pop().get("key")); // if(temp==null){temp=n;}else{temp=n;}  this.nextSibling().reset();
                    var previousSibling=this.previousSibling();
                    //county= Ext.create("Ext.data.Store",  // {  // proxy: {  // type: 'ajax',  // url: 'resources/data/city'+temp+'.json'  // },  // root: {  // text: 'All',  // id: 'all',  // expanded: true  // },  // autoLoad: false  // });     var countyurl='resources/data/county'+temp1+'.json';
                    console.log(countyurl)
                    county.proxy.url=countyurl;
                    county.load({
                        callback: function(records, options, success){
                            Ext.Msg.alert('info', '加载完毕');
                            console.log(temp1)
                        },
                        //scope: store, //Scope用来指定回调函数执行时的作用域  //Add为true时，load()得到的数据会添加在原来的store数据的末尾，  //否则会先清除之前的数据，再将得到的数据添加到store中  add: false  });

                    //store1.load({  // callback: function(records, options, success){  // Ext.Msg.alert('info', '加载完毕');  // },  // //scope: store, //Scope用来指定回调函数执行时的作用域  // //Add为true时，load()得到的数据会添加在原来的store数据的末尾，  // //否则会先清除之前的数据，再将得到的数据添加到store中  // add: false  //});  }
// , // 'change':function(t,n,o,e){ // alert('change'); // }  }
        },
        {
            xtype: "combobox",
            fieldLabel: "选择县市",
            name: "xianname",
            //bind:'{county}',  //id: "xianname",  queryMode: "local",
            //disabled:true,  triggerAction: "all",
            //store: {  // type: 'county'  //},  store:county= Ext.create("Ext.data.Store",
                {
                    proxy: {
                        type: 'ajax',
                        url: 'resources/data/county.json'  },
                    root: {
                        text: 'All',
                        id: 'all',
                        expanded: true  },
                    autoLoad: false  }),
            //store: Ext.create("Ext.data.ArrayStore",  // {  // fields: ["key", "value"],  // data: [["xw", "宣威"], ["bq", "板桥"], ["bs", "宝山"]]  // }),  //multiSelect:true,  labelAlign: "left",
            emptyText: "请选择县",
            typeAhead: true,
            valueField: "key",
            displayField: "value",
            forceSelection: true,
            defaultListConfig: {
                loadMask: false  },
            listeners: {
                'change': function (t, n, o, e) {
                    //alert(temp==null);  var rew=this.rawValue;
                    console.log(this.rawValue);
                    var parent=this.ownerCt;
                    parent.getViewModel().set('county',rew);
// var temp = n; // //Ext.getCmp("cityname").setDisabled(false); // //alert(n); // //alert(r.pop().get("key")); //// if(temp==null){temp=n;}else{temp=n;} // this.nextSibling().reset(); // var previousSibling=this.previousSibling(); // console.log(previousSibling.store) // //store1.load({ // // callback: function(records, options, success){ // // Ext.Msg.alert('info', '加载完毕'); // // }, // // //scope: store, //Scope用来指定回调函数执行时的作用域 // // //Add为true时，load()得到的数据会添加在原来的store数据的末尾， // // //否则会先清除之前的数据，再将得到的数据添加到store中 // // add: false // //});  }
// , // 'change':function(t,n,o,e){ // alert('change'); // } }
        }

    ]
})