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, etc. None seem to work.

The closest I've got is by setting a formatter to the column that I'd like to be editable and then using setCell to set the 'not-editable-cell' class (snippet below). The first time you click the cell, it unfortunately goes into edit mode, but if you click elsewhere and try to re-edit the cell, it's successfully uneditable.

I've also tried using the same开发者_如何学Python snipped but inside of beforeEditCell, it successfully stops the cell from being edited but in turn 'freezes' the grid. You can no longer select any other cell.

function noEditFormatter(cellValue, options, rowObject) {
    if (cellValue == 'test')
        jQuery("#grid").jqGrid('setCell', options.rowId, 'ColName', '', 'not-editable-cell');
    return cellValue;
}

Any help would be much appreciated.

---

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.

---

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}

---

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') return false;
}
// 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}
    ]
});