DropDownList seems to lose its data source after I change the Index, or Disable it.

[Pawel]

I have a C# / ASP.NET web application using Kendo web UI controls and Razor Views. Depending on the user's selection of one drop down ("ddlModelProperty"), it needs to enable or disable other  dropdowns ("ddlSomeOtherModelProperty").

 

In my View file, I have a DropDownList defined like so:

@(Html.Kendo().DropDownListFor(m => m.ModelProperty).HtmlAttributes(new { id = "ddlModelProperty", @class = "k-dropdown-width-30", @tabIndex = "1", style = "width:60px", onchange = "OnChangeModelProperty(this);" }).BindTo(ViewBag.ZeroToOne).OptionLabel(" "))

 

@(Html.Kendo().DropDownListFor(m => m.SomeOtherModelProperty).HtmlAttributes(new { id = "ddlSomeOtherModelProperty", @class = "k-dropdown-width-30", @tabIndex = "1", style = "width:60px" }).BindTo(ViewBag.ZeroToThree).OptionLabel(" "))

 

In the controller, I have a method that returns the ViewResult. In this method, the ViewBag is populated like so:

ViewBag.ZeroToOne = FillDropDownValues(dtData, "ZeroToOne", "Notes", "Item");

ViewBag.ZeroToThree = FillDropDownValues(dtData, "ZeroToThree", "Notes", "Item");

The FillDropDownValues method returns a List<System.Web.Mvc.SelectListItem> object containing the values to be displayed in the drop down.

 

The OnChangeModelProperty(this) method referenced in the onchange HtmlAttribute for ddlModelProperty performs the following:

var cmbVal = $("#" + cmb.id).val();
 var enabled = (cmbVal != "0");

 if (!enabled)
   $("#ddlSomeOtherModelProperty").kendoDropDownList({ index: 0 });

$("#ddlSomeOtherModelProperty").kendoDropDownList({ enable: enabled});

 

The problem is this:

 

My page loads, all drop downs populate and are able to be interacted with as expected. If I select "0" for ddlModelProperty, it disables ddlSomeOtherModelProperty as I expect it to. Then I change ddlModelProperty to a different value. This causes ddlSomeOtherModelProperty to be re-enabled, however when I click the Arrow to expand the DropDown menu nothing appears.

 

This leads me to believe 1 of 2 things is happening:

Either the DataSource is somehow being wiped out and the animation plays-- it just has nothing to display, or simply the animation is broken and isn't displaying at all.

 

What am I doing incorrectly?

[Daniel]

Hello,

The data will be lost because with the used code:

$("#ddlSomeOtherModelProperty").kendoDropDownList({...});

you are initializing a new dropdownlist instance. You should get the existing instance and use the select and enable methods to change the selected index and enabled state e.g.

$("#ddlSomeOtherModelProperty").data("kendoDropDownList").enable(false);

Regards,
Daniel
Telerik