How to have different edit options for add & edit forms in jqGrid

Question

I have a jqGrid with say user information which is to be edited in a form. The username is immutable but should appear in the form so the user is aware which user they are editing. The password is edit only. So in my colModel I have settings like this:

{name:'username', index:'username', width:155, editable:true, editoptions: {readonly:'readonly'}}, 
{name:'password', index:'password', width:155, hidden:true, editable: true, edittype:'password', editrules:{edithidden:true}}, 

This works fine for edit. My problem is on add I need to make the username 'not readonly'. I don't see properties to control the add form vs the edit form. Perhaps I can use the afterShowForm event to change the editoptions? Has anybody done anything like this?

Solution 1

In case it is useful to anybody else, I wasn't able to do this exactly but found a way to accomplish the end result.

So instead of using editoptions to set the form field to readonly I used the beforeShowForm event of the add & edit options to add and or remove the readonly attribute.

So the colmodel without the readonly:

{name:'username', index:'username', width:155, editable:true}, 
{name:'password', index:'password', width:155, hidden:true, editable: true, edittype:'password', editrules:{edithidden:true}}, 

and the navGrid edit & add options to turn the readonly on (for add) or off (for edit). Note, the INPUT tag's ID will be the value of the name field in the colModel:

jQuery("#user-grid").jqGrid('navGrid','#user-grid-pager',
    { }, //options
    { // edit options
        beforeShowForm: function(frm) { 
            $('#username').attr('readonly','readonly'); 
        }
    }, 
    { // add options
        beforeShowForm: function(frm) { 
            $('#username').removeAttr('readonly'); 
        }
    }, 
    { }, // del options
    { } // search options
);

On a side note, while I know (according to jquery dump) the 'frm' function arg is a jQuery object containing the form, I could not get a selector to successfully select the child I wanted so I just used the id which matches the colModel name.

Solution 2

This is possible with built in jqgrid options.

http://www.trirand.com/jqgridwiki/doku.php?id=wiki:common_rules

hidden:true, editrules:{edithidden:true, required:true....}, editable:true

So you can make the field_name editable:false, and the field_id as above

This also covers the other question for select boxes, works for them too