//参数:id 控件id posturl 路径
function initCombobox(id,code){
var value = "";
//加载下拉框复选框
$('#'+id).combobox({
url: posturl ,//后台获取下拉框数据的url
method:'post',
panelHeight:200,//设置为固定高度,combobox出现竖直滚动条
valueField:'CODE',
textField:'NAME',
multiple:true,
formatter: function (row) { //formatter方法就是实现了在每个下拉选项前面增加checkbox框的方法
var opts = $(this).combobox('options');
return '<input type="checkbox" class="combobox-checkbox">' + row[opts.textField]
},
/**
prompt : "输入首关键字自动检索",
filter: function(q, row){
var opts = $(this).combobox("options");
return row[opts.textField].indexOf(q) == 0;
}
*/
onLoadSuccess: function () {
/**
//加载完成后,设置选中第一项
var data = $("#enterprise_type").combobox("getData");
$("#enterprise_type").combobox("select",data[0].value);
*/
//下拉框数据加载成功调用
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);
})
},
// oncahnge控制全选之后不可再选中其他值
onChange:function(valueArray){
var opts = $(this).combobox('options');
if(valueArray ==null){
return;
}
var values = valueArray.join(",");
if(values.indexOf('000000')!=-1){
console.log("=======选中全国了");
$("#"+id).combobox('setValues',['000000']);
var el = opts.finder.getEl(this, '000000');
el.find('input.combobox-checkbox')._propAttr('checked', true);
return;
}else{
//获取选中的值的values
$("#"+id).val($(this).combobox('getValues'));
var el = opts.finder.getEl(this, $(this).combobox('getValues'));
el.find('input.combobox-checkbox')._propAttr('checked', true);
}
},
onSelect: function (row) { //选中一个选项时调用
var opts = $(this).combobox('options');
//获取选中的值的values
$("#"+id).val($(this).combobox('getValues'));
//设置选中值所对应的复选框为选中状态
var el = opts.finder.getEl(this, row[opts.valueField]);
el.find('input.combobox-checkbox')._propAttr('checked', true);
},
onUnselect: function (row) {//不选中一个选项时调用
var opts = $(this).combobox('options');
//获取选中的值的values
$("#"+id).val($(this).combobox('getValues'));
var el = opts.finder.getEl(this, row[opts.valueField]);
el.find('input.combobox-checkbox')._propAttr('checked', false);
}
});
}
我们在选中和取消选中的时候都通过:$(this).combobox('getValues')获取一下combobox的值,然后再将获取的值赋值给$("#id").val($(this).combobox('getValues'))
easyui复选框combobox
最新推荐文章于 2023-04-29 08:12:58 发布