js部分
function initComboboxtext(id,url,valueField,textField,id_con,seconddata,secondurl,param){
var value = "";
$.ajax({
url: url,
type: "POST",
data: {parentId:param},
dataType: "json",
async:false,
success:function(result){
if(result.success){
console.log(result);
$('#'+id).combobox({
data:result.data,
valueField:valueField,
textField:textField,
multiple:true,
formatter: function (row) { //formatter方法就是实现了在每个下拉选项前面增加checkbox框的方法
/* console.info(json)*/
console.log(row);
if(row.selected==true){
opts = "<input type='checkbox' checked='checked' id='"+row.area_code+"' value='"+row.area_code+"'>"+row.complain_class_name+"</input>";
}else{
opts = "<input type='checkbox' id='"+row.area_code+"' value='"+row.area_code+"'>"+row.complain_class_name+"</input>";
}
return opts;
},
onLoadSuccess: function () { //下拉框数据加载成功调
var opts = $(this).combobox('options');
var target = this;
var values = $(target).combobox('getValues');//获取选中的值的values
$.map(values, function (value) {
var el = opts.finder.getEl(target, value);
el.find('input.combobox-checkbox')._propAttr('checked', true);
})
},
onSelect: function (row) { //选中一个选项时调用
var opts = $(this).combobox('options');
//获取选中的值的values
$("#"+id).val($(this).combobox('getValues'));
console.info($(this).combobox('getValues'))
//设置选中值所对应的复选框为选中状态
var el = opts.finder.getEl(this, row[opts.valueField]);
el.find('input')._propAttr('checked', true);
$("#"+id_con).html($(this).combobox('getText'));
},
onUnselect: function (row) {//不选中一个选项时调用
var opts = $(this).combobox('options');
//获取选中的值的values
$("#"+id).val($(this).combobox('getValue'));
console.info($(this).combobox('getValue'))
$("#"+id_con).html($(this).combobox('getText'));
var el = opts.finder.getEl(this, row[opts.valueField]);
el.find('input')._propAttr('checked', false);
}
});
}
},
error:function(request, textStatus, errorThrown){
//$(combId).combobox("loadData",[defaultComb]);
}
});
}
//加载投诉分类二级多选框
function loadWorktaskType() {
$("#worktask_service_type").combobox({
onHidePanel:function(){
var secondData=$(this).combobox('getValues');
//console.log(secondData);
var url = "yjwy/complain/class/queryForCombobox";
initComboboxtext('worktask_worktask_type', url,"pk_complain_class", "complain_class_name",'worktask_worktask_type_con',secondData);
},
onShowPanel:function(){
$("#worktask_worktask_type_con").html("");
}
})
}
//加载投诉分类一级多选框
function loadServiceType() {
var url = "yjwy/complain/class/queryForCombobox";
initComboboxtext("worktask_service_type", url,"pk_complain_class","complain_class_name","worktask_service_type_con");
}
html代码
<tr>
<td style="text-align: end; padding-right: 10px;">
<label>投诉分类(一级):</label>
<input class="easyui-combobox" data-options="editable:false,separator:';'"
name="service_type" id="worktask_service_type"
style="width: 150px;"/>
</td>
<!--展示多选的内容-->
<th colspan="4" style="width:78%;font-weight:100">
<div id="worktask_service_type_con" style="border:1px solid #ddd;min-height:25px;line-height:25px;"></div>
</th>
</tr>
<tr>
<td style="text-align: end; padding-right: 10px;">
<label>投诉分类(二级):</label>
<input class="easyui-combobox" data-options="editable:false,separator:';'"
name="worktask_type" id="worktask_worktask_type"
style="width:150px;"/>
</td>
<th colspan="4" style="width:78%;font-weight:100">
<div id="worktask_worktask_type_con" style="border:1px solid #ddd; min-height:25px;line-height:25px;">
</div>
</th>
</tr>