Jqgrid: Dynamically Set A Cell To Uneditable Based On Content

I'm having some issues getting some cells (with cellEdit: true) to be non-editable even though the column is set to editable. I've tried many ways, like beforeEditCell, formatters

Solution 1:

The idea to use setCell method to add class 'not-editable-cell' to the cells which should be not-editable is correct. You choose only the wrong place to do this. Inside of custom formatter, the grid can be not yet built till the end. I recommend you to use loadComplete or gridComplete to examine the grid contain of the current page and mark some cells as not-editable.

I prepared an example which demonstrate this. Like in your example all cells having "test" text are marked as non-editable. In the way you can examine one cells and mark another cells as non-editable.

Solution 2:

var cellattr = function(rowId, tv, rawObject, cm, rdata) {
if(rawObject.locked) return' class="not-editable-cell"';

};

In colModel: each column options add

{name:'name',index:'name', editable:true, width:100, sortable:false, align:'center', cellattr:cellattr}

Solution 3:

I had to solve this now (2015) and found an approach that looks clean: specify a function for cellbeginedit that returns false if the cell is not allowed to be edited. Taken from the linked article and modified:

var checkIfRowIsValid = function (rowIndex) {
    //somehow get cellValue
    ...
    if (cellValue == 'test') returnfalse;
}
// initialize jqxGrid
$("#jqxgrid").jqxGrid(
{
    source: dataAdapter,
    editable: true,
    selectionmode: 'singlecell',
    columns: [
        { text: 'First Name', columntype: 'textbox', datafield: 'firstname',
        width: 90, cellbeginedit: checkIfRowIsValid},
        { text: 'Last Name', datafield: 'lastname', columntype: 'textbox',
        width: 90, cellbeginedit: checkIfRowIsValid}
    ]
});