Cascading ComboBox issue in Kendo UI for MVC

2 posts, 0 answers
  1. Andrej
    Andrej avatar
    1 posts
    Member since:
    Sep 2013

    Posted 23 Apr 2014 Link to this post

    There is problem with Cascading ComboBox in edit mode. When using for inserting new record – it’s working fine, allowing to choose City and then district in the city selected. When opening record for edit, then Child-ComboBoxFor is empty, although it has value assigned.
    It seems that during initialization, Parent-ComboBoxFor reinitializing Child-ComboBoxFor and value is cleared. How to keep value during Edit?
    I found some articles that similar issue was fixed in 2012 version and we are using latest version of Kendo UI for MVC.
    Code sample is provided below.

    Code for Parent-ComboBoxFor:

    @(Html.Kendo().ComboBoxFor(model => model.CityId)
        .HtmlAttributes(new { id = Html.IdFor(m => m.CityId).ToString() })
        .DataTextField("CityName")
        .DataValueField("CityId")
        .Filter(FilterType.Contains)
        .DataSource(source =>
        {
            source.Read(read =>
                {
                    read.Action(MVC.Object.ActionNames.Cities_Read, MVC.Object.Name);
                });
        })
    )

    Code for Child-ComboBoxFor:

    @(Html.Kendo().ComboBoxFor(model => model.CityAreaId)
        .HtmlAttributes(new { id = Html.IdFor(m => m.CityAreaId).ToString() })
        .Placeholder("Choose area...")
        .DataTextField("Name")
        .DataValueField("Id")
        .Filter(FilterType.Contains)
        .DataSource(source =>
        {
            source.Read(read =>
            {
                read.Action(MVC.Object.ActionNames.GetCascadeCityAreas, MVC.Object.Name).Data("filterCityAreas");
            })
            .ServerFiltering(true);
        })
        .Enable(false)
        .AutoBind(false)
        .CascadeFrom(Html.IdFor(m => m.CityId).ToString())
    )<script>
        function filterCityAreas() {
            return {
                cityId: $("#@Html.IdFor(m => m.CityId)").val(),
                cityAreasFilter: $("#@Html.IdFor(m => m.CityAreaId)").data("kendoComboBox").input.val()
            };
        }
    </script>
  2. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2172 posts

    Posted 25 Apr 2014 Link to this post

    Hi Andrej,

    I tried to reproduce the problem locally but to no avail – everything is working as expected on our side. Could you please try to modify the following CodeLibrary demo to reproduce the issue and send it back to us? This would help us pinpoint the exact reason for this behavior.

    Regards,
    Vladimir Iliev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
Back to Top