ExtJs 省市级联选择代码

Posted 2023-01-12 领尚

extjs 省市级联代码,掌握了,其实省市县等多级联动是一样的

        
            xtype: "combo",
            id: 'prov',
            name: 'prov',
            fieldLabel: '省份',
            width: 280,
            store: provincestore,
            mode: 'local',
            queryMode: 'local',
            editable: false,
            displayField: 'province',
            valueField: 'province',
            allowBlank: true,
            enabled: true,
            value: '',
            listeners: 
                change: function (mecombo)          // 监听省份的选择,变化时去修改市的combo的store
                    citystore.load(
                        params: 
                            subId: mecombo.getValue()
                        
                    );
                    Ext.getCmp('city').setValue('');
                
            ,
            selectOnFocus: true
        ,
            xtype: "combo",
            id: 'city',
            name: 'city',
            fieldLabel: '城市',
            width: 280,
            store: citystore,
            mode: 'local',
            queryMode: 'local',
            editable: false,
            displayField: 'city',
            valueField: 'city',
            allowBlank: true,
            enabled: true,
            value: '',
            listeners: 
                change: function (mecombo)               // 监听市的选择变化,变化时去修改邮政编码栏的值
                    var record = citystore.getAt(citystore.find('city', mecombo.getValue()));
                    if (record) 
                        Ext.getCmp('Postcode').setValue(record.raw.zipcode);
                    
                
            ,  
            id: 'Postcode', 
            name: 'Postcode', 
            xtype: 'textfield', 
            labelWidth: 90, 
            fieldLabel: '邮政编码', 
            width: 210