jqGrid: Disable form fields when editing
You can implement your requirements in different ways. For example, inside of beforeShowForm
event you can hide or show the
jQuery("#list").jqGrid({
colModel: [
{ name: 'Name', width: 200, editable: true },
//...
}).jqGrid('navGrid','#pager', { edit: true, add: true, del: false},
{ // edit option
beforeShowForm: function(form) { $('#tr_Name', form).hide(); }
},
{ // add option
beforeShowForm: function(form) { $('#tr_Name', form).show(); }
});
where the id "tr_Name" is constructed from "tr_" prefix and "Name" - the name property of the column from the colModel
.
UPDATED: In the answer and in another one are shown one more way how the properties can be changed dynamically immediately before the editing will be initialized.
UPDATED 2: Free jqGrid allows to define editable
as callback function or as "disabled"
, "hidden"
or "readonly"
. See the wiki article. It allows to implement the same requirements more easy.
To make the field editable or not, this is what I wound up coding after searching for an answer for a while (to disable editing on in-row edit, but allow it on 'Add') and not finding the answer I needed:
colModel :[
{name:'id', index:'id', editable:false, ...
}).navGrid("#pager",{edit:false,add:true,del:false,search:false,refresh:true},
{}, // edit
{
beforeInitData: function(formid) {
$("#list").jqGrid('setColProp','id',{editable:true});
},
afterShowForm: function (formid) {
$("#list").jqGrid('setColProp','id',{editable:false});
},