Cascade Dropdown not working

[Joanna]

Hi, I have a problem trying to populate my child dropdown. My parent dropdown is able to be populated but once I select it, my child dropdown is still empty. I feel like the problem is once i add in ".data("filterState")" it somehow breaks. My breakpoint is hit if I do not add .data but once I add that, my breakpoint doesn't hit my controller.

 

        <td class="alignright">@Html.LabelFor(m => m.SchoolStateID, "State:", new { @class = "input-label" })</td>
        <td colspan="1" style="text-align:left">
            @(Html.Kendo().DropDownList()
                                .Name("SchoolState")
                                .HtmlAttributes(new { @class = "input-sm form-control" })
                                .OptionLabel("Select State")
                                .DataTextField("State")
                                .DataValueField("Id")
                                .DataSource(source =>
                                {
                                    source.Read(read =>
                                    {
                                        read.Action("GetStateList", "Client");
                                    });
                                })
                                        .Enable(true)
                                        .AutoBind(true)
                                 )  
        </td>
    </tr>
    <tr>
        <td class="alignright">@Html.LabelFor(m => m.CityID, "City:", new { @class = "input-label" })</td>
        <td colspan="1" style="text-align:left">
            @(Html.Kendo().DropDownList()
                                .Name("SchoolCity")
                                .HtmlAttributes(new { @class = "input-sm form-control" })
                                //.OptionLabel("Select City")
                                .DataTextField("City")
                                .DataValueField("Id")
                                .DataSource(source =>
                                    {
                                        source.Read(read =>
                                        {
                                            read.Action("GetCityList", "Client")
                                            .Data("filterCity");
                                        })
                                        .ServerFiltering(true);
                                    })
                                        .Enable(false)
                                        .AutoBind(false)
                                        .CascadeFrom("SchoolState")
                                )
        </td>

 

<script>
    function filterCity() {
        console.log($("#SchoolState").val());
        return {
            schoolstate: $("#SchoolState").val()
        };
    }

</script>

[Martin]

Hello Joanna,

Attached you will find a small project with cascading DropDownLists. Could you please modify it to reproduce any issues you are experiencing? I will then debug the solution and happily assist you.

Looking forward to your reply.

Regards,
Martin
Progress Telerik