标签:
Extjs二级联动
Extjs combox根据省查询城市
实现效果如上图所示,
store层代码:
1 Ext.define("ExtApp.store.TeacherProvince",{
2 extend:"Ext.data.Store",
3 fields:[‘provinceCode‘,‘provinceName‘],
4 autoLoad:true,
5 proxy:{
6 type:"ajax",
7 url : ‘getProvinces.action‘,
8 reader:{
9 type:"json",
10 root:"rows",
11 totalProperty:"results"
12 }
13 }
14 });
view层:
1 {
2 xtype : ‘combo‘,
3 fieldLabel:‘省份‘,
4 name:‘provinceName‘,
5 margin:‘0 3 0 0‘,
6 flex:1,
7 id : ‘cobTeacherProvince‘,
8 store : ‘TeacherProvince‘,
9 valueField : ‘provinceCode‘,
10 displayField : ‘provinceName‘,
11 editable : false,
12 emptyText : ‘请先选省‘,
13 queryMode : ‘local‘
14 },{
15 xtype : ‘combo‘,
16 margin:‘0 0 0 3‘,
17 flex:1,
18 id : ‘cobTeacherCity‘,
19 store : Ext.create(‘Ext.data.Store‘, {
20 fields : [‘cityCode‘,‘cityName‘],
21 autoSync : true,
22 proxy : {
23 type : ‘ajax‘,
24 url : ‘getCitys‘,
25 reader : {
26 type : ‘json‘,
27 root:"rows",
28 totalProperty:"results"
29 }
30 }
31 }),
32 valueField : ‘cityCode‘,
33 displayField : ‘cityName‘,
34 editable : false,
35 emptyText : ‘请选对应的城市‘,
36 queryMode : ‘local‘,
37 fieldLabel : ‘城市‘,
38 name:‘cityName‘
39 }
controller层:
1 SelectCity:function(combo, record){
2 var TeacherCity= Ext.getCmp(‘cobTeacherCity‘)
3 var TeacherCityStore = TeacherCity.getStore();
4 TeacherCity.reset();
5 console.log(combo.getValue());
6 TeacherCityStore.load({
7 params:{‘provinceCode‘:combo.getValue()==null?"":combo.getValue()}
8 })
9 },
标签:
原文地址:http://www.cnblogs.com/shipskunkun/p/4548343.html