javascript – DropDown Waterfall

Question:

My problem is to pass values ​​to controller when doing an update.

I can do the cascading all right. Follow my code.

First DropDown :

@Html.DropDownList(
    "idCanalIndicadoresMassivo", 
    ViewBag.idCanalIndicadoresMassivo as SelectList, 
    "[Selecione]", new { id = "CanalMassivo" }
);

As soon as I get the value of the first, it loads the second.

@Html.DropDownList(
    "idSegmento", 
    new SelectList(Enumerable.Empty<SelectListItem>()),
    "[Selecione]", new { id = "Segmento", disabled = "disabled" }
);

My controller is like this.

ViewBag.idSegmento = new SelectList(db.Segmento, "idSegmento", "descricao", indicadoresmassivosp.idSegmento);

To load the second I load like this.

private IList<Segmento> GetClasses(int idCanalMassivo)
{
    return db.Segmento.Where(m => m.idCanalIndicadoresMassivo == idCanalMassivo).ToList();
}

public JsonResult GetStates(string CanalMassivo)
{
    var classesList = this.GetClasses(Convert.ToInt32(CanalMassivo));
    var classesData = classesList.Select(m => new SelectListItem()
    {
        Value = m.idCanalIndicadoresMassivo.ToString(),
    });

    var states = classesData.Select(m => m.Text).ToList();
    return Json(states, JsonRequestBehavior.AllowGet);
}

Here is my JavaScript:

<script type="text/javascript">
    $(function () {
        $('#CanalMassivo').on('change', function () {
            var stateDropdown = $('#Segmento');
            //disable state drop down
            stateDropdown.prop('disabled', 'disabled');
            //clear drop down of old states
            stateDropdown.empty();

            var select = $("#Segmento");
            select.empty();
            select.append($('<option/>', {
                value: 0,
                text: "[Selecione]"
            }));

            //retrieve selected country
            var CanalMassivo = $(this).val();
            if (CanalMassivo.length > 0) {
                // retrieve data using a Url.Action() to construct url
                $.getJSON('@Url.Action("GetStates")', { CanalMassivo: CanalMassivo })
                    .done(function (data) {
                        //re-enable state drop down
                        stateDropdown.removeProp('disabled');
                        //for each returned state
                        $.each(data, function (i, state) {
                            //Create new option
                            var option = $('<option />').html(state);
                            //append state states drop down
                            stateDropdown.append(option);
                        });
                    })
                .fail(function (jqxhr, textStatus, error) {
                    var err = textStatus + ", " + error;
                    console.log("Request Failed: " + err);
                });
            }
        });
    })
</script>

Controller that makes save

[HttpPost]
    public ActionResult Edit(IndicadoresMassivoSP indicadoresmassivosp)
    {
        {
            if (ModelState.IsValid)
            {

                db.Entry(indicadoresmassivosp).State = EntityState.Modified;
                db.SaveChanges();
                return RedirectToAction("Index");
            }
            return ViewOrPartial(indicadoresmassivosp);
        }
    }

Model

[Required(ErrorMessageResourceType = typeof(App_GlobalResources.Global), ErrorMessageResourceName = "Required")]
    [Display(ResourceType = typeof(App_GlobalResources.Global), Name = "IndicadoresMassivoSP_idIndicadoresMassivo")]        
    public int idIndicadoresMassivo { get; set; }

    [Required(ErrorMessageResourceType = typeof(App_GlobalResources.Global), ErrorMessageResourceName = "Required")]
    [Display(ResourceType = typeof(App_GlobalResources.Global), Name = "IndicadoresMassivoSP_idIndicadoresMassivoMensal")]      
    public int idIndicadoresMassivoMensal { get; set; }


    [Display(ResourceType = typeof(App_GlobalResources.Global), Name = "IndicadoresMassivoSP_idSegmento")]      
    public Nullable<int> idSegmento { get; set; }

    public virtual IndicadoresMassivoMensal IndicadoresMassivoMensal { get; set; }
    public virtual Segmento Segmento { get; set; }

Then when I'm going to update it, it doesn't find the value of the second DropDown , I don't know if my doubt was kind of confused. I need to receive values ​​in the controller

I don't know if the way I'm doing it is also right because I took several examples and that came out, in case you have another example that I can still accept.

Answer:

Prefer to use the typed version of the extension:

@Html.DropDownListFor(model => model.idCanalIndicadoresMassivo, 
    ViewBag.idCanalIndicadoresMassivo as SelectList, 
    "[Selecione]", new { id = "CanalMassivo" }
);

E:

@Html.DropDownListFor(model => model.idSegmento, 
    new SelectList(Enumerable.Empty<SelectListItem>()),
    "[Selecione]", new { id = "Segmento", disabled = "disabled" }
);

Apparently it's a binding issue.

Scroll to Top