dynamische Anzahl von Ajax-Anforderung sequentiell

Question

haben folgendes Szenario:

ich die Graphen für ein gegebenes Intervall (startdate, endDate)

angezeigt werden, weil das Intervall ziemlich groß sein könnte, werden die Daten abgerufen so pro Tag muss ich mehrere tun, ajax-Aufrufe sequenziell und die Daten an die grafische Darstellung (highcharts)

Beispiel Intervall anhängen n Tage ==>

ajax request day 1 

when is (done) ready ajax request day 2 

when is (done) ready ajax request day 3 

.... 

ajax request day n 

las ich über latente und Versprechungen, aber ich fand nur schwer mit dynamischer Anzahl der Tage und die Anforderung antwortet sequentiell

Dank

Answer 1

zu bekommen Wenn Sie Jquery in Ihrer Anwendung verwenden, versuchen alle Ajax drängt einem Array

ex [ajax, ajax, ...]

und dann user

$.when([ajax,ajax,...]).then(function(){ 
console.log(arguments);// you will get the success messages in arguments array 
}) 

Answer 2

Wie rekursiv aufrufen. Erstellen Sie eine parametrisierte Funktion und übergeben Sie den Tag auf die Funktion wie,

Funktion getDetails (Tag) {

// ajax call 
// In the callbacks call the getDetails function by updating the date 

}

Answer 3

Nicht sicher, ob Sie es schon herausgefunden, aber eine gute Art und Weise zu bewältigen Ihr Problem wäre eine Kombination aus jQuery.Deferred und Rekursion. Schauen Sie sich diesen Beispielcode und sehen, ob es hilft, die Dinge klarstellen:

function getData(dayLimit) { 
 
    var allDone = $.Deferred(); 
 

 
    var getDataForDay = function(day) { 
 
    doAsyncThing(day).done(function() { 
 
     if (day < dayLimit) { 
 
     getDataForDay(day + 1); 
 
     } else { 
 
     allDone.resolve(); 
 
     } 
 
    }).fail(function(){ 
 
     /* 
 
     Reject the deferred if one of your operations fails. 
 
     Useful if you're binding "fail" or "always" callbacks 
 
     to the promise returned by getData. 
 
     */ 
 
     allDone.reject(); 
 
    }); 
 
    }; 
 

 
    getDataForDay(1); //start with first day 
 

 
    return allDone.promise(); 
 
}

Lassen Sie mich wissen, wenn Sie mehr Klärungsbedarf, glücklich zu helfen!

Answer 4

Wenn Sie die Liste der Daten in einem Array zu speichern, sind in der Lage, können Sie so etwas wie folgt verwenden:

var items = ['Apple', 'Orange', 'Banana', 'Alphalpha']; 

//replaceable with any function that returns a promise 
function asyncFunction(item) { 
    return $.ajax({ 
    url: '/echo/html', 
    type: 'POST', 
    data : item 
    }) 
    .then(function(data){ 
    $('body').append('<div>Got the response from '+item+'</div>'); 
    //stuff stuff stuff 
    }); 
} 

function sequence(arr, callback) { 
    var i=0; 

    var request = function(item) { 

    return callback(item).then(function(){ 

     if (i < arr.length-1) 
      return request(arr[++i]); 

    }); 
    } 

    return request(arr[i]); 
} 

sequence(items, asyncFunction).then(function(){ 
    $('body').append('<div>Done with all!</div>'); 
}); 

https://jsfiddle.net/7ojy9jnx/2/

Grundsätzlich sequence nimmt ein Array von Gegenständen und führt eine Funktion auf alle von ihnen (in diesem Fall asyncFunctions, die mit jeder Funktion ersetzt werden kann), eine Funktion, die eine Zusage zurückgibt.

Dies ist eine sehr einfache Implementierung, Sie werden feststellen, dass es zum Beispiel keine Fehlerbehandlung hat. Bibliotheken wie async.js haben eine erschöpfende Liste von Werkzeugen, die solche Aufgaben erfüllen, aber wer weiß, vielleicht reicht das aus.