warten auf Ajax-Funktion zu beenden, bis die Funktion erneut mit Intervall

Question

Ich habe eine AJAX-Funktion, um Daten aus dem abrufen und an HTML alle 1sec, der Grund, warum ich AJAX verwenden, weil ich eine Menge Daten abzurufen haben aus der Datenbank, so muss ich es mit Limit (100 Daten pro Limit) holen, also aktualisiere ich die AJAX-Funktion mit Intervall, das Problem ist, dass die angezeigten Daten immer die gleichen sind, weil vor der Funktion das Intervall zu aktualisieren Funktion wieder, gibt es eine Möglichkeit, dieses Problem zu lösen?

JQuery AJAX Code:

var ctr = 0; 
var pct = 0; 
var total = 0; 
var bnprd = "<?php echo $bonperiod;?>"; 
var bnsrt = "<?php echo $bonsort;?>"; 
var mybonperiod = "<?php echo $mybonperiod;?>"; 
var sc = '000'; 
var interval; 

window.onload = function() { 
{getDataNoBreak();} 
}; 

interval = window.setInterval(function() {getDataNoBreak()}, 0);} //set the interval 

function getDataNoBreak() { 
     jQuery(document).ready(function() { 
      jQuery.ajax({ 
       url: "{{ url('panel/bonus/payviasc/getDataNoBreak') }}", 
       type: 'POST', 
       data: {_token :'{{ csrf_token() }}',counter : ctr, bonperiod: bnprd, bonsort: bnsrt}, 
       dataType: "json", 
       success: function(data) { 
        if(ctr==0){ total = data[0].total;} 
        for(var i =0; i < data.length; i++) { 
         if(data[i].loccd) sc = data[i].loccd; 
         else sc = '000'; 
         var htm = ''; 
         htm += '<tr>'; 
         htm += '<td data-label="MEMBER">'+ data[i].dfno +' &nbsp;</td>'; 
         htm += '<td data-label="MEMBER NAME">'+ data[i].fullnm +' &nbsp;</td>'; 
         htm += '<td data-label="SC">'+ sc +' &nbsp;</td>'; 
         htm += '<td data-label="PERIOD">'+ mybonperiod +' &nbsp;</td>'; 
         htm += '<td data-label="GRADE">'+ data[i].level +' &nbsp;</td>'; 
         htm += '<td data-label="BONUS">'+ data[i].totbns +' &nbsp;</td>'; 
         htm += '<td data-label="SIGNATURE"> &nbsp;</td>'; 
         htm += '</tr>'; 
         $("#isi").append(htm); 
         pct += 1; 
         var totalPct = (pct/total)*100; 
         $("#progress".html('<div class="progress-bar progress-bar-striped active" style="width:' + totalPct + '%"></div>')); 
         $("#message").html('Loading data...'); 
         if (totalPct == 100) { 
         completed(); 
         } 
        } 
        if(ctr < total-1) ctr+=101; 
       } 
       , 
       error: function(data) { 
       } 
      }); 
     }); 
    } 

function completed() { //when the interval is finish 
    $("#message").html("Completed"); 
    if(pageBreak == 0){ 
     $('#payviabank').DataTable({ 
     "paging": true, 
     "lengthChange": false, 
     "searching": true, 
     "ordering": false, 
     "info": true, 
     "autoWidth": false 
     }); 
    } 
    window.clearInterval(interval); 
} 

Answer 1

Also zuerst wird Ihr Intervall alle 0 Sekunden ausgelöst, spielt wahrscheinlich in es funktioniert nicht. Was Sie jedoch wollen, ist, dass Sie entweder erfolgreich oder vollständig anrufen. Nur zu vereinfachen:

function makeRequest(payload){ 
    var options = { 
     url : '/path/to/file.php', 
     type : 'POST', 
     data : payload, 
     success : function(res){ 
      //do something with the (res)ponse, maybe make new payload 
      makeRequest(newpayload); //make the call again 
     } 
    } 
    $.ajax(options); 
} 

Natürlich können Sie in zusätzlichen Parametern an die makeRequest Funktion, um passieren müssen sicherstellen, dass Sie nicht die gleichen Daten wieder bekommen.

Answer 2

einen Timeout anstelle eines Intervalls ein.

Dann, in der "Erfolg" -Funktion Ihres Ajax, setzen Sie ein anderes Timeout, um es erneut auszuführen. Auf diese Weise können Sie sicherstellen, dass die Aktualisierung erst nach Abschluss der vorherigen Ajax-Anfrage erfolgt.