extJs下拉框联动实现代码

//第一个下拉框
varparentStore=newExt.data.Store({
proxy:newExt.data.HttpProxy({
url:"loadByParentid.action?parentid=1001"
}),
reader:newExt.data.JsonReader({
root:"list",
id:"id"
},[
{name:"id",mapping:"id"},
{name:"mc",mapping:"name"}
])
});
//第二个下拉框
varchildStore=newExt.data.Store({
proxy:newExt.data.HttpProxy({
//这里是参数可以顺便写,这个数据源是在第一个下拉框select的时候load的
url:"loadByParentid.action?parentid=1001"
}),
reader:newExt.data.JsonReader({
root:"list",
id:"id"
},[
{name:"id",mapping:"id"},
{name:"mc",mapping:"name"}
])
});

{
fieldLabel:"请选择分类",
xtype:"combo",
store:parentStore,
valueField:"id",
displayField:"mc",
mode:"local",
forceSelection:true,//必须选择一项
emptyText:"请选择分类...",//默认值
hiddenName:"interviewsDetail.parent_category",//hiddenName才是提交到后台的input的name
editable:false,//不允许输入
triggerAction:"all",//因为这个下拉是只能选择的，所以一定要设置属性triggerAction为all，不然当你选择了某个选项后，你的下拉将只会出现匹配选项值文本的选择项，其它选择项是不会再显示了，这样你就不能更改其它选项了。
//allowBlank:false,//该选项值不能为空
id:"parent_id",
name:"parent",
width:400,
listeners:{
select:function(combo,record,index){
childStore.proxy=newExt.data.HttpProxy({url:"loadByParentid.action?parentid="+combo.value});
childStore.load();
}
}
},{
xtype:"combo",
store:childStore,
valueField:"id",
displayField:"mc",
//数据是在本地
mode:"local",
forceSelection:true,//必须选择一项
emptyText:"请选择子分类...",//默认值
hiddenName:"interviewsDetail.child_category",//hiddenName才是提交到后台的input的name
editable:false,//不允许输入
triggerAction:"all",//因为这个下拉是只能选择的，所以一定要设置属性triggerAction为all，不然当你选择了某个选项后，你的下拉将只会出现匹配选项值文本的选择项，其它选择项是不会再显示了，这样你就不能更改其它选项了。
//allowBlank:false,//该选项值不能为空
fieldLabel:"选择",
id:"child_id",
name:"child",
width:400
}