Update Dropdownlistfor in form

Asked

Viewed 218 times

0

I have a form that has two @Html.Dropdownlistfor among other fields. However, when changing the first Dropdownlistfor I need to update the values of the other dropdownlist by passing its id as parameter...

@model EP.IdentityIsolation.Domain.Entities.Cadastro.Atividade

@using (Html.BeginForm("SalvarHistoria", "Historia", FormMethod.Post))
                {
                    @Html.AntiForgeryToken()

                <div class="form-body">

                    @Html.ValidationSummary(true, "", new { @class = "text-danger" })

                    <div class="form-group">
                        @Html.LabelFor(model => model.Cliente, htmlAttributes: new { @class = "control-label" })
                        @Html.DropDownListFor(model => model.Cliente.Id, @ViewBag.ListaClientes, "Nenhum", new { @class = "form-control", required = "true", onchange = "?????" })
                        <small>@Html.ValidationMessageFor(model => model.Cliente, "", new { @class = "text-danger" })</small>
                    </div>

                    <div class="form-group">
                        @Html.LabelFor(model => model.Oportunidade, htmlAttributes: new { @class = "control-label" })
                        @Html.DropDownListFor(model => model.Oportunidade.Id, @ViewBag.ListaOportunidades, "Nenhum", new { @class = "form-control", required = "true" })
                        <small>@Html.ValidationMessageFor(model => model.Oportunidade, "", new { @class = "text-danger" })</small>
                    </div>

                    <div class="form-group">
                        @Html.LabelFor(model => model.IsExecutado, htmlAttributes: new { @class = "control-label" })
                        <div class="checkbox">
                            @Html.EditorFor(model => model.IsExecutado)
                            <small>@Html.ValidationMessageFor(model => model.IsExecutado, "", new { @class = "text-danger" })</small>
                        </div>
                    </div>

                </div>

                    <hr />

                    <div class="form-actions" align="right">
                        <button type="button" class="btn btn-danger waves-effect waves-light"><i class="fa fa-times" aria-hidden="true"></i></button>
                        <button type="submit" class="tst3 btn btn-success waves-effect waves-light m-r-10" onclick="validaDataHora();"> <i class="fa fa-check"></i> Salvar</button>
                    </div>
                }
c# asp.net-mvc razor

  • passing the ID of the first select or the value of <Option> selected?

  • yes, when selecting one of the options the second Dropdownlistfor should have the values updated!

  • Let me see if I understand, when for example you select the value of a <option> in the first <select> has to change the second <select> right? But change how? Loading Customer Opportunities Chosen or Opportunities are already loaded and you just need to select it?

  • Yes, I need to carry the opportunities of the chosen customer.

1 answer

0


I managed to solve the problem using ajax.

So did my dropdownlist:

@Html.DropDownListFor(model => model.Cliente.Id, cliente, "Nenhum", new { @class = "form-control", required = "true", onchange = "atualizaOportunidade(this);" })

@Html.DropDownListFor(model => model.Oportunidade.Id, new List<SelectListItem>(), "Nenhum", new { @class = "form-control", required = "true" })

Ajax function to update opportunity dropdownlistfor values when changing client:

@section Scripts {
<script type="text/javascript">

    // Combobox Oportunidade
    function atualizaOportunidade(cliente) {
        debugger;
        var idCliente = cliente.value;

        $.ajax({
            url: "~/ListaOportunidade",
            type: 'post',
            dataType: 'json',
            data: { idCliente: idCliente },
            success: function (data) {
                debugger;

                // Remover todos existentes;
                $('#Oportunidade_Id').empty();

                // Criar campo vazio;
                var opt = new Option("Nenhum", null);
                $('#Oportunidade_Id').append(opt);

                // Carrega lista do retorno
                for (var i = 0; i < data.length; i++) {
                    var opt = new Option(data[i].Descricao, data[i].Id);
                    $('#Oportunidade_Id').append(opt);
                }
            }
        });

    }
</script> }

Browser other questions tagged c# asp.net-mvc razor

You are not signed in. Login or sign up in order to post.