Need to make individual jqgrid cells editable based on a certain value

Question

I have a jqGrid and I want certain cells to be editable based on the value in a separate hidden cell. So every row in the grid does not have the same config. In other words, I don't want an entire column to be editable.

I put the code below in the loadComplete event for the grid. I loop through each row and set the editable property on EstimatedCost and AverageSalePrice to true based on the hidden value ProductCatIndex.

var ids = $('#' + jqgrid_id).jqGrid('getDataIDs');
var count = $('#' + jqgrid_id).getGridParam('reccount');

for (var x = 0; x < count; x++) {
    var rowId = ids[x];

    if (row.ProductCatIndex == 2) {
        $('#' + jqgrid_id).jqGrid('setCell', rowId, 'EstimatedCost', '', '', { 'editable': true });
    }
    else if (row.ProductCatIndex == 3) {
        $('#' + jqgrid_id).jqGrid('setCell', rowId, 'AverageSalePrice', '', '', { 'editable': true });
    }
}

I step through the code and see it running properly, however the cells are not editable. I have cellEdit: true at the grid level but I do not set the editable property on the column as I am trying to set it dynamically in the code above. Any help would be greatly appreciated!

Answer 1

The way you do this does not have any effect

I can recommend other way to do this.

The cell is not editable if it has a class 'not-editable-cell', instead that in colModel is set to be editable. See the docs here

This way a cellattr function can be used, since it add attributes during creation. See docs here too

Set the editable property to true and try with this code:

colModel : [ 
    ...
    { name : 'EstimatedCost', editable : true,..., 
         cellattr : function( id, val, rawdata, cm, rdata)  { 
             ret = ""
             if( parseInt(rdata['ProductCatIndex'],10) !== 2 ) {
                 ret = " class='not-editable-cell'";
             }
             return ret;
         }
     }

Do the same for the other field.