create a pause before opening modal window to load scripts

3

These scripts add specific format to a table, when the page is opened for the first time everything is shown correctly, but to visualize the modal for the second time the files are loaded very fast and it is not applied on the table.

function salida()
{        
       $.ajax({
        url: '../reportes/cufinn',
        type: 'POST',
        dataType: 'json',
          data:{
            datos:'where estatus=0'
        },
    })
    .done(function(data) {

       for (i = 0; i <=data.length; i++) {
          if((i % 2)=== 0)
            {
            var c=' bgcolor= "#E0ECF8"';
            }
            else
            {
            var c='';
            }
           $("#datos1").append('<tr>'+
            '<td>'+data[i]['ejercicio']+'</td>'+
            '<td>'+data[i]['periodo']+'</td>'+
            '<td>'+data[i]['Movimientoef'].toUpperCase()+'</td>'+
            '<td>'+data[i]['Perdidaf']+'</td>'+
            '<td>'+data[i]['Perdidaa']+'</td>'+
            '<td>'+data[i]['Resultadof']+'</td>'+
            '<td>'+data[i]['PTUPP']+'</td>'+
            '<td>'+data[i]['PTUCC']+'</td>'+
            '<td>'+data[i]['ISRR']+'</td>'+
            '<td>'+data[i]['Nod']+'</td>'+
            '<td>'+data[i]['UFINN']+'</td>'+
            '<td>'+data[i]['difec']+'</td>'+
            '<td>'+data[i]['SaldosA']+'</td>'+
            '<td>'+data[i]['INPCMM']+'</td>'+
            '<td>'+data[i]['INPCFAA']+'</td>'+
            '<td>'+data[i]['Fact']+'</td>'+
            '<td>'+data[i]['SaldoAAc']+'</td>'+
            '<td>'+data[i]['Divp']+'</td>'+
            '<td>'+data[i]['SaldoTT']+'</td>'+
            '</tr>');
        }
    });  
   //alert("Cuin");
}

   function salida2()
       {        
        $.ajax({
        url: '../reportes/cufinn',
         type: 'POST',
        dataType: 'json',
          data2:{
            datos:'where estatus=1'
        },
    })
    .done(function(data2) {

       for (i = 0; i <=data2.length; i++) {
          if((i % 2)=== 0)
            {
            var c=' bgcolor= "#E0ECF8"';
            }
            else
            {
            var c='';
            }
           $("#datos2").append('<tr>'+
            '<td>'+data2[i]['ejercicio']+'</td>'+
            '<td>'+data2[i]['periodo']+'</td>'+
            '<td>'+data2[i]['Movimientoef'].toUpperCase()+'</td>'+
            '<td>'+data2[i]['Perdidaf']+'</td>'+
            '<td>'+data2[i]['Perdidaa']+'</td>'+
            '<td>'+data2[i]['Resultadof']+'</td>'+
            '<td>'+data2[i]['PTUPP']+'</td>'+
            '<td>'+data2[i]['PTUCC']+'</td>'+
            '<td>'+data2[i]['ISRR']+'</td>'+
            '<td>'+data2[i]['Nod']+'</td>'+
            '<td>'+data2[i]['UFINN']+'</td>'+
            '<td>'+data2[i]['difec']+'</td>'+
            '<td>'+data2[i]['SaldosA']+'</td>'+
            '<td>'+data2[i]['INPCMM']+'</td>'+
            '<td>'+data2[i]['INPCFAA']+'</td>'+
            '<td>'+data2[i]['Fact']+'</td>'+
            '<td>'+data2[i]['SaldoAAc']+'</td>'+
            '<td>'+data2[i]['Divp']+'</td>'+
            '<td>'+data2[i]['SaldoTT']+'</td>'+
            '</tr>');
        }
    });  
    alert("Cuin");
}


        <script onload="salida()" src="<?php echo base_url("/_js/fixed_table_rc.js");?>" type="text/javascript" ></script>
<script onload="salida2()" src="<?php echo base_url("/_js/fixed_table_rc2.js");?>" type="text/javascript" ></script>
<script src="<?php echo base_url("/_js/build.js");?> "></script>
    
asked by dev Garcia 05.04.2018 в 20:24
source

3 answers

0

If I am correct, it is because all the requests are made asynchronously by default, if you want the ajax request to be synchronized you must change the default value true to false in:

 $.ajax({
        url: '../reportes/cufinn',
        type: 'POST',
        async: true,
        dataType: 'json',
          data:{
            datos:'where estatus=0'
        },
    })

Here you can read a little more: link

    
answered by 05.04.2018 / 21:32
source
0

The problem is that the two scripts run in the onLoad event, as you did there would be no way of knowing which of the two ran first. I do not think that if you put false the async works. I leave you another solution where I embedded the AJAX, in parameter success (I did not use the DONE method) When the first part ends, we immediately run the second part, thus chaining the process.

//Función similar a onLoad
$(function() {

  //Primera llamada de AJAX
  $.ajax({
    url: '../reportes/cufinn',
    type: 'POST',
    dataType: 'json',
    data: {
      datos: 'where estatus=0'
    },
    success: function(data) {
      //Callback del proceso 1
      for (i = 0; i <= data.length; i++) {
        if ((i % 2) === 0) {
          var c = ' bgcolor= "#E0ECF8"';
        } else {
          var c = '';
        }
        $("#datos1").append('<tr>' +
          '<td>' + data[i]['ejercicio'] + '</td>' +
          '<td>' + data[i]['periodo'] + '</td>' +
          '<td>' + data[i]['Movimientoef'].toUpperCase() + '</td>' +
          '<td>' + data[i]['Perdidaf'] + '</td>' +
          '<td>' + data[i]['Perdidaa'] + '</td>' +
          '<td>' + data[i]['Resultadof'] + '</td>' +
          '<td>' + data[i]['PTUPP'] + '</td>' +
          '<td>' + data[i]['PTUCC'] + '</td>' +
          '<td>' + data[i]['ISRR'] + '</td>' +
          '<td>' + data[i]['Nod'] + '</td>' +
          '<td>' + data[i]['UFINN'] + '</td>' +
          '<td>' + data[i]['difec'] + '</td>' +
          '<td>' + data[i]['SaldosA'] + '</td>' +
          '<td>' + data[i]['INPCMM'] + '</td>' +
          '<td>' + data[i]['INPCFAA'] + '</td>' +
          '<td>' + data[i]['Fact'] + '</td>' +
          '<td>' + data[i]['SaldoAAc'] + '</td>' +
          '<td>' + data[i]['Divp'] + '</td>' +
          '<td>' + data[i]['SaldoTT'] + '</td>' +
          '</tr>');
      }

      //Segunda llamada AJAX dentro del callback del proceso 1
      $.ajax({
        url: '../reportes/cufinn',
        type: 'POST',
        dataType: 'json',
        data2: {
          datos: 'where estatus=1'
        },
        success: function(data2) {
          //Callback del proceso 2
          for (i = 0; i <= data2.length; i++) {
            if ((i % 2) === 0) {
              var c = ' bgcolor= "#E0ECF8"';
            } else {
              var c = '';
            }
            $("#datos2").append('<tr>' +
              '<td>' + data2[i]['ejercicio'] + '</td>' +
              '<td>' + data2[i]['periodo'] + '</td>' +
              '<td>' + data2[i]['Movimientoef'].toUpperCase() + '</td>' +
              '<td>' + data2[i]['Perdidaf'] + '</td>' +
              '<td>' + data2[i]['Perdidaa'] + '</td>' +
              '<td>' + data2[i]['Resultadof'] + '</td>' +
              '<td>' + data2[i]['PTUPP'] + '</td>' +
              '<td>' + data2[i]['PTUCC'] + '</td>' +
              '<td>' + data2[i]['ISRR'] + '</td>' +
              '<td>' + data2[i]['Nod'] + '</td>' +
              '<td>' + data2[i]['UFINN'] + '</td>' +
              '<td>' + data2[i]['difec'] + '</td>' +
              '<td>' + data2[i]['SaldosA'] + '</td>' +
              '<td>' + data2[i]['INPCMM'] + '</td>' +
              '<td>' + data2[i]['INPCFAA'] + '</td>' +
              '<td>' + data2[i]['Fact'] + '</td>' +
              '<td>' + data2[i]['SaldoAAc'] + '</td>' +
              '<td>' + data2[i]['Divp'] + '</td>' +
              '<td>' + data2[i]['SaldoTT'] + '</td>' +
              '</tr>');
          }
        }
      });
    }
  });
});
    
answered by 05.04.2018 в 21:52
0

If I understand you correctly, I think you could solve it using callbacks . That is, send "output2 ()" by parameter to "output ()" so that it executes when the latter ends.

For example, I have the function "output ()" that receives a function by parameter. The "output ()" function makes an asynchronous call and when it is finished, execute callback () .

function salida(callback) {
    $.ajax({
        url: 'someurl',
        type: 'POST',
        dataType: 'json',
        data: {
            // json data
        },
        success: function(data) {
            // do something

            if (typeof(callback) === 'function')
                callback();
        }
    });
}

Now, the way to call this function would be:

salida(function(){
    // do something after execute
});

or also:

function salida2() {
    // do something
}

salida(salida2);
    
answered by 06.04.2018 в 15:25