Update div with PHP return after Ajax request

Question

Opa,

I have the following function for an ajax login

            function show_login_client_enter(id) {
                var url = 'store/content/validate_user_client_action.php';
                var method = 'POST';
                var params = 'id_store='+id;
                params += '&user_acao=1';
                params += '&user_email='+document.getElementById('user_email').value;
                params += '&user_pwd='+document.getElementById('user_pwd').value;
                var container_id = 'loading_validate_client_action_login';
                var loading_text = 'Loading...' ;
                ajax (url, method, params, container_id, loading_text) ;
                $(document).ajaxComplete(scripts);
            }

In the PHP file validate_user_client_action.php, when the user logs in I need to refresh a div with data from another php file, but how to call a function or how to refresh a php return from an ajax request?

I need the return of the login in php of something like:

echo '
<script type="text/javascript">
    $("#loading_client_content_info").load("store/content/client_info.php");
</script>
';

This . load code does not return anything, nor in the console.

Answer 1

So I tried to understand what you wanted and I came to this. If it’s not exactly that, let’s try to solve it another way!

//Primeira chamada AJAX
function show_login_client_enter(id){
  $.ajax({
  type: 'POST',
  url: 'store/content/validate_user_client_action.php',
  data: { id_store: id, user_acao: '1', user_email: document.getElementById('user_email').value, user_pwd: document.getElementById('user_pwd').value },
  beforeSend:function(){
    // O código aqui dentro será executado antes do envio, podemos colocar o loading aqui por exemplo!
    //$('#algumaDiv').html('<div class="loading"><img src="/images/loading.gif" alt="Loading..." /></div>');
  },
  success:function(data){
    // A request foi bem sucedida, agora temos o retorno em "data"
    console.log(data); // Abre o console e você vai ver a resposta!
    //Chama a outra função
    pegaClientInfo(data.algumaCoisa);
  },
  error:function(){
    // A request falhou! Diga ao usuário
    $('#algumaDiv').html('<p class="error"><strong>Algo errado!</strong> Tente novamente.</p>');
  }
});  
}

//Segunda chamada AJAX
function pegaClientInfo(algumaCoisa){
    $.ajax({
  type: 'POST',
  url: 'store/content/client_info.php',
  data: { param: algumaCoisa}, //Envia o parametro que você precisar para pegar os dados do cliente neste arquivo
  beforeSend:function(){
    // O código aqui dentro será executado antes do envio, podemos colocar o loading aqui por exemplo!
    //$('#algumaDiv').html('<div class="loading"><img src="/images/loading.gif" alt="Loading..." /></div>');
  },
  success:function(data){
    // A request foi bem sucedida, agora temos o retorno em "data"
    console.log(data); // Abre o console e você vai ver a resposta!
    $("#loading_client_content_info").html = data;
  },
  error:function(){
    // A request falhou! Diga ao usuário
    $('#algumaDiv').html('<p class="error"><strong>Algo errado!</strong> Tente novamente.</p>');
  }
});
}

If you repair, calls have callbacks for some situations. Ex: Before sending, if successful or if you fail! You can do whatever you want :)

What I did was, I made the first call(validate_user_client_action), if successful, we called the second (client_info) and from this you can update your div with the client data!