When editing a grid, how do I disable specific fields by row? Kendo UI ASP.Net MVC wrapper

Question

I have a kendo grid using ASP.NET MVC wrappers and has multiple columns (say col 1 and 2). The grid is set to InCell editing mode. Columns 1, 2 need to be able to be edited (or preventing editing) based off the values of each other for a specific row.

For instance, if column 1 value is true then column 2 is allowed to be edited. if column 2 value is false, then column 2 is not allowed to be edited.

Any ideas?

I found similar example but using client side extensions.

When editing a grid, how do I disable specific fields by row?

Is there a similar way to do it using ASP.Net MVC wrappers?

possible duplicate of Make cell readonly in Kendo Grid if condition is met — Lars Höppner

EricksonG EricksonG · Accepted Answer · 2014-02-24T16:35:26

We just ran across a similar issue and found the following solution. It might not be the right way to do it, but it seems to work for disabling a field when the row is existing and enabling when it is new. This logic should be able to be swapped for any logic you need.

In your Kendo MVC bindings. "disableOnEdit" is the name of a Javascript function to call when the cell goes into edit mode.

@(Html.Kendo().Grid<yourModel>()
  .Name("grid")
...
  .Events(events => events.Edit("disableOnEdit"))
...

In your JavaScript:

function disableOnEdit(e) {
    if (e.model.isNew()) {
        // Leave it editable if the row is new.
    } else {
        // Disable the editor for Element in this row if the row already exists.
        var select = e.container.find('input[name=Element]').data('kendoDropDownList');
        select.enable(false);
    }
}

This approach was borrowed from Kendo Grid Edit Docs

See the other answer mentioned about for different conditions.

Thanks to Chris Finlayson for pairing on this.

When editing a grid, how do I disable specific fields by row? Kendo UI ASP.Net MVC wrapper

1 Answers