How to disable field in inline editing based on value in another column in Kendo?

Question

image of my kendo grid

<div style="display: block; width: 100%; height: 100%">
        @(Html.Kendo().Grid<ProjectTechnologyLinkModel>()
            .Name("gridProjectTechnologies")
            .HtmlAttributes(new { @class = "k-grid-autoheight" })
            .Pageable()
            .Columns(columns =>
            {
                columns.Bound(x => x.Id).Hidden();
                columns.Bound(x => x.TechnologyId).Title("Technology Name").Width(200)
                    .EditorTemplateName("GridDropdownList")
                    .ClientTemplate("#:TechnologyName#");
                columns.Bound(x => x.Others_info).Title("Specify technology (if others only)").Width(200);//add
                columns.Bound(x => x.Percentage).Format("{0}%").Title("Percentage").Width(80);
                columns.Command(command =>
                {
                    command.Edit().UpdateText("Save");
                    command.Destroy();
                }).Width(120);
            })
            .ToolBar(t => t.Create().Text("Add"))
            .Editable(editable => editable.Mode(GridEditMode.InLine))
            .DataSource(dataSource => dataSource
                .Ajax()
                .PageSize(10)
                .Events(e => {
                    e.Error("error_handler");
                    e.Change("updateTechnologiesMultiselect");
                })
                .Model(model =>
                {
                    model.Id(x => x.Id);
                    model.Field(x => x.Id).Editable(false);
                    //model.Field(x => x.Others_info).Editable(false);
                })
                .Create(read => read.Action("AddProjectTechnologyLink", "ProjectInfo", new { projectInfoId = ViewBag.ProjectId }))
                .Read(read => read.Action("GetProjectTechnologyLink", "ProjectInfo", new { projectId = ViewBag.ProjectId }))
                .Update(read => read.Action("UpdateProjectTechnologyLink", "ProjectInfo"))
                .Destroy(read => read.Action("DeleteProjectTechnologyLink", "ProjectInfo"))
            )
            .Scrollable(p => p.Height("auto"))
            .Resizable(resize => resize.Columns(true))
            .Pageable(pagable => pagable.Refresh(true).PageSizes(new int[] { 10, 20, 50, 100 }))
        )
    </div>

I have two column : a) Technology Name b) Specify technology (if others only)

What I want to do is to disable field under "Specify technology (if others only)" column if value in "Technology Name" is not equal "Others".

Please advise. Thanks.

Answer 1

One way to achieve this would be to apply EditorTemplates on the two columns. If your Specify technology item has id of 2 for example:

@model Int32

@if(ModelTechnologyId !=2){
@(Html.Kendo().Input(i => i)
            .Name("Others_info"))
}else{
    @Html.TextBox("",Model,new{disabled="disabled"})
}

see here for another approach: Enable or disable kendo grid columns based on another column value