Kendo Grid Modifying State of Editing Buttons

We have a grid that is using inline editing with an edit and delete button. We want the Delete button to be disabled in certain states to prevent the user using it. This can be done using the onDataBound event on the grid.

Example: In the viewmodel there is bool InUse which is true if a delete cannot be done.

Add to the grid

.Events(events => events.DataBound("onDataBound"))

Then implement

function onDataBound(e) {  
    var grid = e.sender;
    var data = grid.dataSource.view();

    for (var i = 0; i < data.length; i++) {
        if (data[i].InUse === true) {
            var delButton = grid.tbody.find("tr[data-uid='" + data[i].uid + "'] .k-grid-delete");
            delButton.addClass("k-state-disabled").removeClass("k-grid-delete");
        }
    }
}

If the button is in a locked region then use

function onDataBound(e) {  
    var grid = e.sender;
    var data = grid.dataSource.view();

    for (var i = 0; i < data.length; i++) {
        if (data[i].InUse === true) {
            var delButton = $(".k-grid-content-locked").find("tr[data-uid='" + data[i].uid + "'] .k-grid-delete");
            delButton.addClass("k-state-disabled").removeClass("k-grid-delete");
        }
    }
}

Above referring to version
Telerik Kendo UI Professional Q1 2015
Telerik UI for ASP.NET MVC Q1 2015
*


comments powered by Disqus