jqGrid使用setColProp方法動態改變列屬性

在使用jqGrid插件時，有時我們需要動態改變列的屬性，可使用setColProp方法，用法如下

jQuery(”#grid_id”).setColProp('colname',{editoptions:{value:“True:False”}});

這里舉個詳細的例子。

使用Form Editing（彈出一個新的編輯窗口進行編輯和新增）的方式來修改內容時，根據行id的內容來決定該行是否可編輯，如果id號以字符“p"打頭，則該行的groupname可編輯，否則就不可編輯。代碼如下

--------------------------------------------------------------------------------------

 

//修改通訊錄，如果是固定人員，即id不以p開頭，則不允許編輯分組groupname
function edit(){
var gr = jQuery("#gridTable").jqGrid('getGridParam','selrow');
var rowdata=$("#gridTable").jqGrid().getRowData(gr);
var options={width:350,top:300,left:600,reloadAfterSubmit:true,closeAfterEdit:true,
};
if( rowdata != null ){
if(rowdata.id.indexOf("p") == 0){
$("#gridTable").jqGrid('editGridRow',gr,options);
}else{
$("#gridTable").setColProp('groupname',{editable:{value:"True:False"}});//設置editable屬性由true改為false
$("#gridTable").jqGrid('editGridRow',gr,options);
} 
}else alert("請選擇要編輯的行");
};

---------------------------------------------------------------------------------------

 

使用jqGrid提供的setColProp方法對於動態改變列屬性是非常有用的，但是有些屬性的修改並不會起效。具體是哪些屬性，讀者可自行驗證。

補充：

編輯jqGrid中的內容的方法有三種

Cell Editing——只允許修改某一個單元格內容

Inline Editing——允許在jqGrid中直接修改某一行的數據兩種修改jqGrid內容的方式

Form Editing——彈出一個新的編輯窗口進行編輯和新增

具體請參考其他教程，在此不再贅述。