Ext菜单联动的完善解决方案

Ext菜单联动的完美解决方案
情景说明：
省份下拉框和城市下拉框联动：
formpanel编辑的时候使用在

form.getForm().load({
				waitMsg : '正在加载数据',
				waitTitle : '提示',
				url : '/webmaster/admin/userAction.do?method=getUserInfoWithJson',
				method : 'POST',
				success : function(frm, action) {
					// Ext.Msg.alert('提示', '加载成功');
					var pname = action.result.data.provinceName;//省份
					var cname = action.result.data.cityName;//城市
					Ext.getCmp('webmasterprovinceCmp').setRawValue(pname);
					Ext.getCmp('webmastercityCmp').setRawValue(cname);
				},
				failure : function(frm, action) {
					Ext.Msg.alert('提示', '原因如下：' + action.result.errors.info);
				}
			});

省份下拉框代码：

{
											xtype : 'combo',
											store : new Ext.data.Store({
												proxy : new Ext.data.HttpProxy(
														{
															url : '/webmaster/admin/globalAction.do?method=getProvinceList'
														}),
												reader : new Ext.data.JsonReader(
														{
															root : 'rows',
															totalProperty : 'total'
														}, [{
																	name : 'id'
																}, {
																	name : 'name'
																}])
											}),
											displayField : 'name',
											valueField : 'id',
											fieldLabel:'省份',
//											hideLabel : true,
											width : 100,
											editable : false,
											mode : 'remote',
											triggerAction : 'all',
											forceSelection : true,
											typeAhead : true,
											name : 'provinceID',
											id:'webmasterprovinceCmp',
											hiddenName : 'provinceID',
											emptyText : '--请选择省份--',
//											pageSize : 10,
//											disabled : true,
											listeners : {
												'select' : {
													fn : function(combo,
															record, index) {
														Ext.getCmp('webmastercityCmp').change = true;//
														Ext.getCmp('webmastercityCmp').reset();//重置城市
													},
													scope : this
												}
											}
											// allowBlank : false
										}

关键代码：
在省份ComboBox的select事件中，设置城市ComboBox的自定义属性change=true和重置城市ComboBox

城市ComboBox代码：

{
											xtype : 'combo',
											store : new Ext.data.Store({
												proxy : new Ext.data.HttpProxy(
														{
															url : '/webmaster/admin/globalAction.do?method=getCityByProvinceId'
														}),
												reader : new Ext.data.JsonReader(
														{
															root : 'rows',
															totalProperty : 'total'
														}, [{
																	name : 'id'
																}, {
																	name : 'name'
																}])
											}),
											listeners:{
												'beforequery':function(queryEvent){
													var provinceId =  Ext.getCmp('webmasterprovinceCmp').getValue();
													if(provinceId>0&&queryEvent.combo.change){
														var province = Ext.getCmp('webmasterprovinceCmp').getRawValue();
														queryEvent.combo.store.load({params:{provinceName:province}});
														queryEvent.combo.change = false;
													}
													return true;
												}
											},
											change:true,
											displayField : 'name',
											valueField : 'id',
											fieldLabel:'城市',
											width : 100,
											editable : false,
											mode : 'local',
											triggerAction : 'all',
											forceSelection : true,
											typeAhead : true,
											name : 'cityId',
											id:'webmastercityCmp',
											hiddenName : 'cityId',
											valueNotFoundText:'--请选择城市--',
											emptyText : '--请选择城市--'
										}

关键代码：
1、为城市ComboBox添加了一个自定义属性change,用来表示省份是否是改变了。
2、将城市ComboBox的mode=local
3、在城市ComboBox的beforequery事件响应函数中加载数据，并返回true。