easyui複選框combobox
阿新 • • 發佈:2018-12-19
//引數: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'))