Refresh DropDownListFor on form

Question

Refresh DropDownListFor on form

Navigation

#1 by (0 votes)

0

I have a form that has two @Html.DropDownListFor and other fields. But when I change 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

asked by anonymous 07.02.2018 / 20:35

1 answer

Copy values from a PHP array Identify the input URL of a Filter

score 0 · Accepted Answer

I was able to solve the problem using ajax.

That's how my dropdownlist went:

@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> }