problem with page complete in ajax

1

I have a code that is working relatively well but has a small problem that I do not know how to solve ...

In a page I have several combos that when clicking launch ajax requests and will complete other combos and simultaneously restrict a table with the new values. It seems very complicated but it is not and is working fine except when I launch an ajax request it has the famous image informing that the request is in progress and disappears when the data is returned.

Now with me this is not running very well, because when I make the request that implies updating the combo and the table (this request is the one that returns more data because it is when there is still a lot of information to be filtered) it updates well the combo but has a difference of the update of the table that arrives to be of several seconds, disappears the image and 4 or 5 seconds later the data of the table update ...

I will leave the part of the code where I place the requests and the ajax functions, to try to understand if it will be from here that comes the problem ... if they need other codes to understand the rest of the process just ask.

 <script type="text/javascript" src="js/jquery-1.4.4.js"></script>
 <script type="text/javascript">

 /*first call----------*/
 $(document).ready(function () {  
 $(".drop").change(function () {        // ao clicar no combo mostra a div onde estao as          
  imagens de processamento enquanto a resposta não é page complete
 $(document).ajaxStart(function () {
 $("#wait").css("display", "block");
 });
 $(document).ajaxComplete(function () {
 $("#wait").css("display", "none");    // ao obter resposta de complete volta a esconder    
 a div que tem as imagens de processamento
 });
    var id = $(this).val();
    var dataString = empresa + id;    // establece agumas variaveis a passar no pedido  
  ajax
    $.ajax({
        type: "POST",
        url: "empresa.php",
        data: dataString,
        success: function (html) {

            $("#tab2").html(html);     // retorna o valor do processado na pagina do 
   pedido e substitui a div com esse valor
            $("#tab3").text(" ");      // insere texto em branco para "limpar" as outras 
    divs
            $("#tab4").text(" ");

            /*second call*/
            $.ajax({            // em simultaneo com o 1º pedido lança este 
    pedido a uma pagina diferente para retornar em uma div diferente 
                type: "POST",
                url: "lista.php",
                data: dataString,
                success: function (html) { 
                    $("#nomes").css("display", "block");
                    $("#nomes").html(html);

                }
            });
        }
      });
    
asked by anonymous 04.04.2014 / 16:06

1 answer

1

Well I do not have much knowledge but it gave me a little understanding of what was causing the problem with the chrome (network) tip, because the first call was very fast and really had to generate the complete ..., so is the solution that resulted in full in my case ...

I removed the global ajax complete ....

     $(".drop").change(function () {
     $("#wait").css("display", "block");  // fica fixo aqui o aparecimento da div

And I put in the last request the hiding of the div ...

   $("#nomes").css("display", "block");
    $("#nomes").html(html);
                $("#wait").css("display", "none");

    

04.04.2014 / 17:53