How to add value to an input when pressing a link with jquery?

Question

I’m having the following problem: I’m not getting to set the value in one input when he’s inside a function. Example:

$(document).on('click',".edita_cliente", function(){
    var id = $(".seq").val();
    $.ajax({
        url: 'php/lista_clientes.php?service=2&id=' + id,
        type: 'get',
        dataType: 'json',
        success: function (data) {
            setTimeout(function(){
                $("#content").load('cadastra_cliente.php');
                $("#nome_cad").val(data[0].Nome);
            }, 700);
        }
    });
});

This function, when I click the button, it closes the modal, loads the page. But it is not putting the value in the input. I tested from others shapes, and I realized he didn’t arrow any value in the input when you are within a function. Can someone explain to me why?

Thank you in advance!

Answer 1

You need to make a callback in the .load to be able to enter the value in the input that will be loaded. That setTimeout is totally unnecessary. See:

$(document).on('click',".edita_cliente", function(){
   var id = $(".seq").val();
   $.ajax({
      url: 'php/lista_clientes.php?service=2&id=' + id,
      type: 'get',
      dataType: 'json',
      success: function (data) {
         $("#content").load('cadastra_cliente.php', function(){
            $("#nome_cad").val(data[0].Nome);
         });
      }
   });
});

After the callback, the element will be properly loaded in the .load and can be used. The way you are doing, the code passes directly from .load without waiting for his return.