Question

I have a Telerik asp.net grid on my view. The model that is connected to this grid has a field named “State”. This field holds the state of each row. Based on this state, user can edit some of the rows, and can’t edit the rest. For example if state of a row is 0, the user can edit it, otherwise the edit button and other commands of that row must be disabled.

So my question is: Is there a way to disable some of the rows based on the model’s fields?

here is the simplified grid:

@{Html.Telerik().Grid<StationEvaluation>().Name("ManagementGrid").DataKeys(dataKeys => dataKeys.Add(o => o.StationEvaluationID)).Groupable().Filterable().Pageable().Sortable().DataBinding(dataBinding => dataBinding.Ajax()
                           .Delete("DeleteFromGrid", "StationEvaluation")
                        ).Columns(columns =>
                        {
                            columns.Command(commands =>
                            {
                                commands.Delete().ButtonType(GridButtonType.Image);
                                commands.Custom("Edit").Action("Edit", "StationEvaluation").ButtonType(GridButtonType.Image).Text("Edit");
                            }).Title("Manage").Width(50);
                            columns.Bound(o => o.FromDate);
                            columns.Bound(o => o.ToDate);
                            columns.Bound(o => o.DateShow);
                            columns.Bound(o => o.State).ClientTemplate("<#= StateDsc #>");
                            columns.Command(commands =>
                            {
                                commands.Custom("NextState").Action("NextState", "StationEvaluation").ButtonType(GridButtonType.Text).Text("Next state").Ajax(true);
                                commands.Custom("PreviousState").Action("PreviousState", "StationEvaluation").ButtonType(GridButtonType.Text).Text("Previous state").Ajax(true);
                            }).Title("Change state").Width(50);
                        }).Render();
 }

Answer 1

I found the solution. The onRowDataBound event must be added to the gird. In this method I can hide the columns that user needs them to edit:

function ManagementGrid_onRowDataBound(e) {

    var dataItem = e.dataItem;

    if (dataItem.State == 0)
    {
        $(e.row).find("a.t-grid-PreviousState").hide();
    }
    else if (dataItem.State == 4) {
        $(e.row).find("a.t-grid-NextState").hide();
    }
}