在实际项目中,有这么一个需求,3个下拉框选项是属于级联级别的,新增时:当选中第1个下拉框的值时,第二个下拉框根据第一下拉框中的类型查询数据,当第二个下拉框选中值时查询第三个下拉框的值并回显,修改时:回显选中第一个下拉框值,然后查询第二个下拉框并回显,然后查询第三个下拉框并回显
function dangerAllTypeLoad(params){
//稽核單位類型
$('#fm_checkDepId').combobox({
url:ctx + "/danger/getDangerCheck",
queryParams:{"queryColumn":["id","checkName"],"ord":["id asc"]},
valueField:'id',
textField:'text' ,
panelHeight:'auto',
editable:false,
required : true,
onSelect:function(v){
//父類型
$("#fm_parentTypeId").combobox({
url:ctx + "/dangerType/getDangerType",
queryParams:{"queryColumn":["id","typeName"],"key":["checkTypeId","status"],"value":[v.id,"1"],"ord":["typeCode asc"],"sql":" and parentTypeId is null "},
valueField: 'id',
textField: 'text',
editable:false,
required : true,
panelHeight:'auto',
onSelect:function(v1){
//子類型
$("#fm_typeId").combobox({
url:ctx + "/dangerType/getDangerType",
queryParams:{"queryColumn":["id","typeName"],"key":["checkTypeId","parentTypeId","status"],"value":[v.id,v1.id,"1"],"ord":["typeCode asc"]},
valueField: 'id',
textField: 'text',
editable:false,
required : true,
panelHeight:'auto',
onLoadSuccess: function (){
if (params!=null&¶ms.typeId!=null) {
$("#fm_typeId").combobox('select',params.typeId);
params = {};
}
}
});
},
onLoadSuccess: function (){
if (params!=null&¶ms.parentTypeId!=null) {
$("#fm_parentTypeId").combobox('select',params.parentTypeId);
}
}
});
},
onLoadSuccess: function (){
if (params!=null&¶ms.checkDepId!=null) {
$("#fm_checkDepId").combobox('select',params.checkDepId);
}
}
});
}
其中函数的参数params是用来修改时赋值的,如果只是添加则不用使用combobox中的onLoadSuccess
var typeParams = {};
typeParams.checkDepId = data.rows[0].checkDepId;
typeParams.parentTypeId = data.rows[0].parentTypeId;
typeParams.typeId = data.rows[0].typeId;
dangerAllTypeLoad(typeParams);
dangerAllTypeLoad(null);
//清空二级或者三级内容,防止先点击修改接着点击新增后二级和三级有值
$("#fm_parentTypeId").combobox("loadData",[]);
$("#fm_typeId").combobox("loadData",[]);
感谢 https://blog.csdn.net/qq_36698956/article/details/98957360