Jquery fill <select>

Asked

Viewed 68 times

1

I’m having trouble filling out a combo.

On the return of JS the date comes the whole list, but the fill does not show.

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>

Return date:

inserir a descrição da imagem aqui

as it appears

inserir a descrição da imagem aqui

my libraries:

<script src="~/Scripts/jquery-3.3.1.js"></script>
<script src="~/Scripts/relatorio.js"></script>
  • How and where you are calling the function?

  • In the same Js file at the very beginning of the document ---- $(Document). ready(Function() ' Load client();

  • Have you tried pulling this one out async: false,? It is totally not recommended. Especially because it doesn’t need to, since Ajax is only executed if the function is executed after the DOM...

  • @Sam worked out, thanks. I’ve been getting beat up here for over two hours

  • Put as an answer that I mark with right

1 answer

4


Unused async: false, in Ajax. Ajax must be processed asynchronously. Since Ajax is only processed when a function is called after the DOM, it makes less sense to use it synchronously.

Then just remove the async: false, that select will be populated normally:

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(); });

Browser other questions tagged

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