0

Tenho 2 DropList um de Cliente e outro de Projeto, após selecionar o cliente ele deve receber os projetos que estão com o IdCliente, eu consegui fazer tudo certo, porém ao selecionar outro cliente, ele acrescenta no DropDownList e não apaga aqueles que não tem relação com o Cliente aonde estou errando?

[Controller]

       [HttpPost]
    public ActionResult obterProjeto(int idCliente)
    {
        List<Projeto> ListaExemplo = new List<Projeto>();

        var teste = _context.Projeto.Where(s => s.IdCliente == idCliente)
            .Select(ss => new
            {
                NomeProjeto = ss.NomeProjeto,
                IdProjeto = ss.IdProjeto,
            }).ToList();

        foreach (var item in teste)
        {
            Projeto VMColab = new Projeto();
            VMColab.IdProjeto = item.IdProjeto;
            VMColab.NomeProjeto = item.NomeProjeto;
            ListaExemplo.Add(VMColab);
        }

        return Json(ListaExemplo);
    }

[View]

<div class="row">
    <div class="col-md-6">
        Nome Cliente:
        @Html.DropDownList("TabelaCliente", new SelectList(ViewBag.ListaClientes, "IdCliente", "NomeCliente"))
    </div>

    <div class="col-md-6">
        Nome Projeto
        @*@Html.DropDownList("TabelaProjeto", new SelectList(Enumerable.Empty<SelectListItem>(), "IdProjeto", "NomeProjeto"))*@
        @Html.DropDownList("TabelaProjeto", new SelectList(Enumerable.Empty<SelectListItem>(), "IdProjeto", "NomeProjeto"))
    </div>

[JavaScript]

<script type="text/javascript">
$(document).ready(function () {
    $('#TabelaCliente').change(function () {
        var idCliente = $('#TabelaCliente').val();
        if (idCliente > 0) {
            $.post('@Url.Action("obterProjeto", "teste")', { 'idCliente': idCliente }, function (data) {
                if (data.length > 0) {
                    for (var i = 0; i < data.length; i++) {
                        $('#TabelaProjeto').append('<option value="' + data[i].idprojeto + '">' + data[i].nomeProjeto + '</option>');
                    }
                }

            });
        }
    });
});

1 Resposta 1

0

Antes de fazer o append, você deve esvaziar o dropdown. Pode fazer com:

$('#TabelaProjeto').empty();

Coloque o código acima antes do for. O .empty() esvazia o elemento, ou seja, remove todo o conteúdo que ele tiver.

Por exemplo, se eu tiver um dropdown com options:

<select id="TabelaProjeto">
   <option></option>
   <option></option>
   <option></option>
</select>

Ao executar $('#TabelaProjeto').empty(), o resultado será:

<select id="TabelaProjeto">
</select>
1

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .