This is a migrated thread and some comments may be shown as answers.

Conditionally disable column with EditorTemplateName

1 Answer 638 Views
This is a migrated thread and some comments may be shown as answers.
Top achievements
Rank 1
Dave asked on 03 Jul 2014, 05:23 PM

Hey everyone,

I have a Kendo grid that has two columns on it. Column A dictates what happens in column B. Column B uses an EditorTemplateName file that contains a Kendo drop down list. When certain values are selected in column A, I need to disable editing in the drop down list in column B.

Right now I am just trying to focus on getting the DropDown or column to disable (Ignoring the condition). I have tried doing this in the Edit event of the grid, however nothing will disable the column or the dropdown. The user is always able to click the cell and expand the dropdown despite setting things like "enabled = false;" How do I stop this?


.Columns(column =>
column.ForeignKey(p => p.A_ID, (System.Collections.IEnumerable)ViewData["A"], "A_ID", "A_Name").Title("A").Width(150);
column.ForeignKey(p => p.B_ID, (System.Collections.IEnumerable)ViewData["B"], "B_ID", "B_Name").EditorTemplateName("Template").EditorViewData((System.Collections.IEnumerable)ViewData["B"]).Title("B");
.ToolBar(toolbar =>
toolbar.Create().Text("Add New");
toolbar.Save().Text("Save"); //Needed for saving the grid. Hidden by CSS.
.Editable(editable => editable.Mode(GridEditMode.InCell))
.Navigatable(n => n.Enabled(true))
.Events(e => e.Edit("onEdit"))
.DataSource(dataSource => dataSource
.Events(events => events.Error("error_handler"))

.Model(model =>
model.Id(p => p.ID);
model.Field(p => p.ID).Editable(false);
model.Field(p => p.A_ID).DefaultValue(1);

.Create(update => update.Action("C_Create", "Controller"))
.Read(read => read.Action("C_Read", "Controller"))
.Update(update => update.Action(C"_Update", "Controller"))
.Destroy(update => update.Action("C_Destroy", "Controller"))



Html.Kendo().DropDownListFor(m => m)

function OnEdit(e)

var B_DropDown = e.container.find("#B_ID").data("kendoDropDownList");

if (B_DropDown) {
//Some custom filtering based on the value in Column A
 B_DropDown.dataSource.filter({ field: "A_ID", operator: "eq", value: e.model.A_ID });
 B_DropDown.enable = false; //Doesn't work.

var dropdown = e.container.find("B_ID");

dropdown.hidden = true; // Doesn't work 
dropdown.disabled = true; //Doesn't work.
dropdown.enable = false; //Doesn't work.
dropdown.enabled = false; //Doesn't work.

var grid = $("#grid").data("kendoGrid");
var row =;
var uid ="uid");
$('[data-uid="' + uid + '"] td:nth-child(2)').text("");
$('[data-uid="' + uid + '"] td:nth-child(2)').enabled = false; //Doesn't work.  

1 Answer, 1 is accepted

Sort by
Atanas Korchev
Telerik team
answered on 07 Jul 2014, 03:27 PM
Hello Dave,

You should use enable as a method:


Atanas Korchev
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Asked by
Top achievements
Rank 1
Answers by
Atanas Korchev
Telerik team
Share this question