1

Estou com problema pra preencher um combo.

No retorno do JS o data vem toda a lista, mas no preencher não mostra.

Meu Js :

  function CarregaCliente() {
        $.ajax({
            url: "/Clientes/SelecionarCliente",
            async: false,
            success: function (data) {

                $("#cliente").empty();

                console.log(data);
                $.each(data, function (i, element) {                    
                    $("#cliente").append('<option value=' + element.Id + '>' + element.Nome + '</option>');
                });
            }
        });
    }

HTML:

   <div class="form-group">
                <label>Cliente</label>
                <select id="cliente" class="form-control"></select>
            </div>

Retorno data:

inserir a descrição da imagem aqui

como aparece

inserir a descrição da imagem aqui

minhas bibliotecas:

<script src="~/Scripts/jquery-3.3.1.js"></script>
<script src="~/Scripts/relatorio.js"></script>
5
  • Como e onde vc está chamando a função?
    – Sam
    Commented 6/01/2019 às 22:40
  • No mesmo arquivo Js logo ao iniciar o documento ---- $(document).ready(function () { CarregaCliente(); Commented 6/01/2019 às 22:50
  • Já tentou retirando esse async: false,? Ele é totalmente não recomendado. Até porque nem precisa, já que o Ajax só é executado se a função for executada após o DOM...
    – Sam
    Commented 6/01/2019 às 22:53
  • @Sam deu certo obrigada.. Apanhando aqui a mais de 2h Commented 6/01/2019 às 22:59
  • Coloque como resposta que que eu marco com certo Commented 6/01/2019 às 22:59

1 Resposta 1

3

Não se usa async: false, em Ajax. O Ajax deve ser processado de forma assíncrona. Já que o Ajax só é processado quando uma função for chamada após o DOM, faz menos sentido ainda usá-lo de forma síncrona.

Então basta retirar o async: false, que o select será populado normalmente:

function CarregaCliente() {
     $.ajax({
         url: "/Clientes/SelecionarCliente",
         // async: false, 
         success: function (data) {

             $("#cliente").empty();

             console.log(data);
             $.each(data, function (i, element) {                    
                 $("#cliente").append('<option value=' + element.Id + '>' + element.Nome + '</option>');
             });
         }
     });
 }

 $(document).ready(function () { CarregaCliente(); });

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 .