php使用easy ui combobox级联,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'

});

});