Easy ui combobox 多级联动 （四级联动）

在多级联动的时候需要先初始化combobox组件，数据的加载采用reload放在上一级combobox的onChange中，

不要在onchange中嵌套onchange，否则会导致回调混乱，而单独声明各个对象的触发条件则正常。

下面这段代码是我在一个程序中使用的，用来完成年级、级部、学科、周次的四联动，只有改变前一个项的值后一个值就跟着改变，效果如图

//先初始化对象
$(function(){
$('#grade').combobox({
width: 70,
panelHeight: "auto",
editable: false,
valueField: 'id',
textField: 'text',
onLoadSuccess: function () {
//加载完成后,设置选中第一项
var val = $(this).combobox("getData");
for (var item in val[0]) {
if (item == "id") {
$(this).combobox("select", val[0][item]);
}
}
},

onChange: function () {
//更新下一级列表
$('#branch').combobox('reload', "ad_ReviewModi.aspx?action=GBCList&type=branch&ParentOrgId=" + $(this).combobox("getValue"));
}
});
$('#branch').combobox({
width: 70,
panelHeight: "auto",
editable: false,
valueField: 'id',
textField: 'text',
onLoadSuccess: function () {
//加载完成后,设置选中第一项
var val = $(this).combobox("getData");
for (var item in val[0]) {
if (item == "id") {
$(this).combobox("select", val[0][item]);
}
}
},
onChange: function () {
//更新市列表
$('#course').combobox('reload', "ad_ReviewModi.aspx?action=GBCList&type=course&ParentOrgId=" + $(this).combobox("getValue"));
}
});
$('#course').combobox({
width: 70,
panelHeight: "auto",
editable: false,
valueField: 'id',
textField: 'text'
});
});

最后

以上就是义气夏天为你收集整理的Easy ui combobox 多级联动 （四级联动）的全部内容，希望文章能够帮你解决Easy ui combobox 多级联动 （四级联动）所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。