Hello,
I'm implementing cascading dropdown lists in my web app. I currently have three lists and have them set up following the example listed on your site. However, when I make a selection in the first dropdown, the other two will then read in their data and become enabled. It doesn't cascade down properly like in the example. I don't see any difference between the example and how I have things coded, so perhaps someone here can see what I'm doing wrong. I want my lists to cascade properly. Thanks for any and all help. Code sample listed below.
I'm implementing cascading dropdown lists in my web app. I currently have three lists and have them set up following the example listed on your site. However, when I make a selection in the first dropdown, the other two will then read in their data and become enabled. It doesn't cascade down properly like in the example. I don't see any difference between the example and how I have things coded, so perhaps someone here can see what I'm doing wrong. I want my lists to cascade properly. Thanks for any and all help. Code sample listed below.
<
p
>
<
label
class
=
"searchLabel"
for
=
"state"
>State:</
label
>
@(Html.Kendo().DropDownList()
.Name("state")
.HtmlAttributes(new { style = "width:275px" })
.OptionLabel("Select state...")
.DataTextField("StateName")
.DataValueField("StateAbbr")
.DataSource(source => source.Read(read => read.Action("GetStates", "Home")))
)
</
p
>
<
p
>
<
label
class
=
"searchLabel"
for
=
"county"
>County:</
label
>
@(Html.Kendo().DropDownList()
.Name("county")
.HtmlAttributes(new { style = "width:275px" })
.OptionLabel("Select county...")
.DataTextField("CountyName")
.DataValueField("CountyName")
.DataSource(source => source.Read(read => read.Action("GetCounties", "Home").Data("filterCounties"))
.ServerFiltering(true))
.Enable(false)
.AutoBind(false)
.CascadeFrom("state")
)
</
p
>
<
p
>
<
label
class
=
"searchLabel"
for
=
"city"
>City:</
label
>
@(Html.Kendo().DropDownList()
.Name("city")
.HtmlAttributes(new { style = "width:275px" })
.OptionLabel("Select city...")
.DataTextField("CityName")
.DataValueField("CityName")
.DataSource(source => source.Read(read => read.Action("GetCities", "Home").Data("filterCities"))
.ServerFiltering(true))
.Enable(false)
.AutoBind(false)
.CascadeFrom("county")
)
</
p
>
<
script
>
function filterCounties() {
return {
state: $("#state").val()
};
}
function filterCities() {
return {
state: $("#state").val(),
county: $("#county").val()
};
}
$(document).ready(function() {
$("#state").data("kendoDropDownList");
$("#county").data("kendoDropDownList");
$("#city").data("kendoDropDownList");
});
</
script
>