Conditionally disable column with EditorTemplateName

[Dave]

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?

main.cshtml:

@(Html.Kendo().Grid<My.Namespace.ViewModel>()
.Name("grid")
.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.
})
.Selectable()
.Editable(editable => editable.Mode(GridEditMode.InCell))
.Navigatable(n => n.Enabled(true))
.Pageable()
.Sortable()
.Scrollable()
.Events(e => e.Edit("onEdit"))
.AutoBind(false)
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Events(events => events.Error("error_handler"))
.ServerOperation(true)

.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"))

)
.ToClientTemplate()

Template.cshtml

@(
Html.Kendo().DropDownListFor(m => m)
.BindTo((System.Collections.IEnumerable)ViewData["B"])
.DataTextField("B_Name")
.DataValueField("B_ID")
)


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 = grid.select();
var uid = row.data("uid");
$('[data-uid="' + uid + '"] td:nth-child(2)').text("");
$('[data-uid="' + uid + '"] td:nth-child(2)').enabled = false; //Doesn't work.  

[Atanas Korchev]

Hello Dave,

You should use enable as a method:

 B_DropDown.enable(false);

Regards,
Atanas Korchev
Telerik