easyui下拉複選和全選
阿新 • • 發佈:2019-02-16
$("#subFundId").combobox({
panelHeight:'auto',
multiple:true,
multiline:true,
editable:false,
required:false,
valueField: 'fundId',
textField: 'fundName',
data: fofFundInfo,
formatter:function(row){
var opts = $(this).combobox('options');
return '<input type="checkbox" class="combobox-checkbox">' + row[opts.textField]
},
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(record){
var opts = $(this).combobox('options');
var valueField = opts.valueField;
//獲取選中的值的values
if(!record[valueField]){
var checkFlag = opts.finder.getEl(this, record[valueField]).find('input.combobox-checkbox')._propAttr('checked');
var data= $(this).combobox('getData');
var values = $(this).combobox("getValues");
var selectVaues = [];
if((data.length - 1) != data.length){
if(checkFlag){
for(var i=0;i<data.length;i++){
var el = opts.finder.getEl(this, data[i].fundId);
el.find('input.combobox-checkbox')._propAttr('checked', false);
if(data[i].fundId){
selectVaues.splice($.inArray(data[i].fundId,checkParams.busIds),1);
checkParams.busIds.splice($.inArray(data[i].fundId,checkParams.busIds),1);
}
}
}else{
for(var i=0;i<data.length;i++){
var el = opts.finder.getEl(this, data[i].fundId);
el.find('input.combobox-checkbox')._propAttr('checked', true);
if(data[i].fundId){
selectVaues.push(data[i].fundId);
checkParams.busIds.push(data[i].fundId);
}
}
}
}
console.log(selectVaues);
$(this).combobox('setValues', selectVaues);
}else{
//設定選中值所對應的複選框為選中狀態
var el = opts.finder.getEl(this, record[opts.valueField]);
el.find('input.combobox-checkbox')._propAttr('checked', true);
checkParams.busIds.push(record.fundId);
}
$("#subFundId").val($(this).combobox('getValues'));
console.log($("#subFundId").val());
},
onUnselect:function(record){
var opts = $(this).combobox('options');
var valueField = opts.valueField;
//獲取選中的值的values
$("#subFundId").val($(this).combobox('getValues'));
//當取消全選勾中時,則取消所有的勾選
var data= $(this).combobox('getData');
var values = $(this).combobox("getValues");
var selectVaues = [];
//設定選中值所對應的複選框為選中狀態
for(var i=0;i<data.length;i++){
var el = opts.finder.getEl(this, data[i].fundId);
//去除全選選中狀態
if(!data[i].fundId){
el.find('input.combobox-checkbox')._propAttr('checked', false);
}
}
var el = opts.finder.getEl(this, record[opts.valueField]);
el.find('input.combobox-checkbox')._propAttr('checked', false);
checkParams.busIds.splice($.inArray(record.fundId,checkParams.busIds),1);
}
});
panelHeight:'auto',
multiple:true,
multiline:true,
editable:false,
required:false,
valueField: 'fundId',
textField: 'fundName',
data: fofFundInfo,
formatter:function(row){
var opts = $(this).combobox('options');
return '<input type="checkbox" class="combobox-checkbox">' + row[opts.textField]
},
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(record){
var opts = $(this).combobox('options');
var valueField = opts.valueField;
//獲取選中的值的values
if(!record[valueField]){
var checkFlag = opts.finder.getEl(this, record[valueField]).find('input.combobox-checkbox')._propAttr('checked');
var data= $(this).combobox('getData');
var values = $(this).combobox("getValues");
var selectVaues = [];
if((data.length - 1) != data.length){
if(checkFlag){
for(var i=0;i<data.length;i++){
var el = opts.finder.getEl(this, data[i].fundId);
el.find('input.combobox-checkbox')._propAttr('checked', false);
if(data[i].fundId){
selectVaues.splice($.inArray(data[i].fundId,checkParams.busIds),1);
checkParams.busIds.splice($.inArray(data[i].fundId,checkParams.busIds),1);
}
}
}else{
for(var i=0;i<data.length;i++){
var el = opts.finder.getEl(this, data[i].fundId);
el.find('input.combobox-checkbox')._propAttr('checked', true);
if(data[i].fundId){
selectVaues.push(data[i].fundId);
checkParams.busIds.push(data[i].fundId);
}
}
}
}
console.log(selectVaues);
$(this).combobox('setValues', selectVaues);
}else{
//設定選中值所對應的複選框為選中狀態
var el = opts.finder.getEl(this, record[opts.valueField]);
el.find('input.combobox-checkbox')._propAttr('checked', true);
checkParams.busIds.push(record.fundId);
}
$("#subFundId").val($(this).combobox('getValues'));
console.log($("#subFundId").val());
},
onUnselect:function(record){
var opts = $(this).combobox('options');
var valueField = opts.valueField;
//獲取選中的值的values
$("#subFundId").val($(this).combobox('getValues'));
//當取消全選勾中時,則取消所有的勾選
var data= $(this).combobox('getData');
var values = $(this).combobox("getValues");
var selectVaues = [];
//設定選中值所對應的複選框為選中狀態
for(var i=0;i<data.length;i++){
var el = opts.finder.getEl(this, data[i].fundId);
//去除全選選中狀態
if(!data[i].fundId){
el.find('input.combobox-checkbox')._propAttr('checked', false);
}
}
var el = opts.finder.getEl(this, record[opts.valueField]);
el.find('input.combobox-checkbox')._propAttr('checked', false);
checkParams.busIds.splice($.inArray(record.fundId,checkParams.busIds),1);
}
});