1. 程式人生 > >jQuery easyUI combobox

jQuery easyUI combobox

$('#cc').combobox({
	formatter: function(row){
		var opts = $(this).combobox('options');
		return row[opts.textField];
	}
});
上面是jQuery easyUI官網上找到的。
現在我們要做成如下這樣的:
  則可以通過手動設定formatter樣式。
剖析頁面程式碼發現,是把列表的text值放到了一個div下,則我們就組裝一個複選框與text同級就可以了
  具體js程式碼如下:
 formatter: function(row){
                 var $d = $(this).combobox('getData');
                 var $o = $(this).combobox('options');
                 var $c = '<input type="checkbox"/>';
                 if($d[0].id==row[$o.valueField]){
                     $c = '<input type="checkbox" checked="checked"/>';
                 }
                 return  $c+ row[$o.textField];
 }
 
 
 要想選擇panel面板複選框也跟著選擇則需要在combobox執行後加載如下程式碼:
var $p = $("#zd_name").combobox('panel');/*選框物件——勾選複選框*/
                
$p.children("div").bind("click",function(){                         var $i = $(this).find("input");                         var $cis = $(this).attr("class");                         if($cis.indexOf("combobox-item-selected")>0){                             $i.removeAttr("checked");                         }else{                             $i.attr("checked","checked");                         }                 });