Disable Cell In Grid via Javascript

[Robert]

When I set the cell disable property to true the disabled attribute on the TD HTML element does not get created.
var grid = $("#" + GRID).data("kendoGrid");
var gridRow = grid.current().closest("tr");
gridRow.cells[0].disabled = true;

If you look via the debugger the cells disabled property is set to true after the above code is executed however the TD table element for the cell does NOT contain the disabled class/attribute, hence it is not rendered as disabled.

How do you disable a cell in the grid using javascript after the grid has been initially rendered?

[Dimiter Madjarov]

Hi Robert,


If you are referring to disabling the cell input, when editing, you could bind to the edit event of the Grid and use the e.container parameter to access the current cell/row (depending on the current edit mode).
E.g.

function(e){
    $(e.container).find("input[name='ProductName']").prop('disabled', true);
}

Please let me know if this was the information that you were looking for.

 

Regards,
Dimiter Madjarov
Telerik

[Jacques]

For anyone rooting around for a solution... disabling in edit event works fine if mouse clicking but if tabbing a navigatable grid it blows up the tab order.  I'm sure there are a million ways around this - I've done about 20 of them.  My current favorite is to use a readonly input field as a custom editor... set the border width 0... and add the k-textbox class.  It remains tab friendly, readable, presents consistently with other cell editors, and protects your data from editing while the column remains sortable and the underlying data updatable through the model.

Hope it helps someone.