天天看點

jqgrid根據資料分組情況標明checkbox

jqgrid加載了一組資料,對這組資料根據其enable和disable屬性進行分組,并且其enable和disable是可以edit的。為了edit這個屬性,我們選用checkbox的狀态代表其屬性狀态。checkbox選中代表enable,checkbox沒有選中代表disable。

為了在頁面顯示checkbox,我們在colModel中應用其option formatter來實作:

{...,   formatter: function (cellValue, option) {return '<input type="checkbox"  id="checkbox_' + option.rowId + '" checked/>'}},  

這時頁面中所有checkbox都是選中的,為了取消對disable屬性資料的checkbox的checked屬性,我們需要選出哪些資料具有disable屬性。可以用兩個全局數組來記錄所有資料的rowid和disable(或enable)屬性,例如 var isNotEnabledArray = new Array();  var rowIdArray = new Array();  在formatter時對其進行初始化,如下

formatter: function (cellValue, option) {

isNotEnabledArray.push(cellValue);

rowIdArray.push(option.rowId);

return '<input type="checkbox"  id="checkbox_' + option.rowId + '" checked/>'

}

然後在事件時remove掉disable資料的checkbox的checked屬性,代碼如下:

gridComplete: function() {

var arrayLength = 0;

var len = rowIdArray.length == isNotEnabledArray.length ? 0:(rowIdArray.length < isNotEnabledArray.length ? 1:2);

switch(len) {

case 0:

arrayLength = rowIdArray.length;

break;

case 1:

arrayLength = rowIdArray.length;

break;

case 2:

arrayLength = isNotEnabledArray.length;

break;

default:

break;

}

for(var i=0; i<arrayLength; i++) {

if(isNotEnabledArray[i] != "checked")

$("#checkbox_"+rowIdArray[i]).removeAttr("checked");

}

},

繼續閱讀