[Solved] Combobox Cascade setting value to 0

[superservo15]

Hi,
We are using the Telerik MVC controls from Nuget. Great so far, but ran into something I can't figure out.

So we have two combo boxes, Plants and Units, with Plants cascading into Units.
I'll post the code below. My problem is, when a plant is selected and Units reloads with the correct values, it ALWAYS sets the selected valeu to be "0" text. When you open the drop down it's not an option to pick, but it sets it be default every time. When we switch the control to be a dropdownlist it works perfectly, however our users wants the combo box and not the drop down. I've debugged the fetch for the unit data and it's bringing back the proper values, no extra 0 anywhere.

Have you telerik guys seent his before or am I doing something obviously worng? Any help is appreciated, thanks :)

<div class="editor">
            @Html.LabelFor(model => model.Plant)
            @( Html.Telerik().ComboBoxFor(model => model.PlantId)
                   .BindTo(new SelectList((IEnumerable<MDL.Models.Plant>)ViewBag.PossiblePlants, "PlantId", "Description"))
                    .Placeholder("Select Plant...")
                    .CascadeTo("UnitId")
                    .SelectedIndex(0)
            )
              @Html.ValidationMessageFor(model => model.PlantId)
       </div>


    <div class="editor">
           @Html.LabelFor(model => model.Unit)
            @( Html.Telerik().ComboBoxFor(model => model.UnitId)
                 .DataBinding(binding => binding.Ajax().Select("_GetDropDownListUnits", "NewAnomaly"))
                    .Placeholder("Select Unit...")
                    .SelectedIndex(0)

            )
            @Html.ValidationMessageFor(model => model.UnitId)
     </div>

[HttpPost]
        public JsonResult _GetDropDownListUnits(int? PlantId)
        {
            return _GetUnits(PlantId);
        }
        private JsonResult _GetUnits(int? PlantID)
        {

            IQueryable<Unit> units = unitRepository.All;
            if (PlantID.HasValue) { units = units.Where(p => p.PlantId == PlantID.Value); }
            return Json(new SelectList(units, "UnitID", "Description"), JsonRequestBehavior.AllowGet);
        }

[Petur Subev]

Hello Jasmine,

In the online demos it does not seems to behave like this:

http://demos.telerik.com/aspnet-mvc/combobox/cascadingcombobox

I believe you configure the ComboBox the same way it will start to behave the same way.

Kind regards,
Petur Subev
the Telerik team

[superservo15]

Soooo not sure if you actually looked at my code, but besides using a comboboxfor instead of a combobox (as we need to bind the selected value) and casting of the viewbag, my code is the same as the online demos. Obviously I looked at those first. I just switched the code to use combobox to see if that was the difference, but it is still defaulting the 2nd combobox to 0 even though it is not an option or a value in the list returned fromt he Json call. BTW this behaviour does not happen with DropDownListFor, but  our user wants the flexibility of the combobox. 

Any help is much appreciated.

We are using the telerik libraries

 

<link type="text/css" href="/Content/2012.3.1018/telerik.common.min.css" rel="stylesheet"/>
<link type="text/css" href="/Content/2012.3.1018/telerik.default.min.css" rel="stylesheet"/>

 

And jquery

<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>

 

[Petur Subev]

Hello Jasmine,

I tried to reproduce this on my side but I cannot experience such behavior to what you described (what version do you use?).

 Please put this into a small demo project which we can run on our side and search for a solution.

Kind Regards,
Petur Subev
the Telerik team

[superservo15]

Figured it out!

So I made my stub app as you suggested with the latest telerik version on nuget and it worked perfect!
So I started comparing everything.

I looked at the generated source code / scripts using ie tools and noticed that there is a "selectedValue" attribute on the generated code for my bad drop down, but not one on the working stub. Obviously my culprit is the selectedValue, but I couldn't track down where it came from... The generated code from the script tab that is NOT working is:

jQuery('#UnitId').tComboBox({autoFill:false, highlightFirst:false, placeholder:'Select Unit...', ajax:{"selectUrl":"/NewAnomaly/_GetDropDownListUnits"}, selectedValue:'0', index:0});

After sleeping on it and pondering some more, I realized my UnitId coming from my model was 0 because it is a non-nullable required field.
So I switched it to nullable and thanks the heavens, that 0 is gone! Still need to figure out how to ensure this field is still required, but at least I know why it kept defaulting to 0.

Thanks for the help and your time!