Username
Username

Reputation: 3663

How to execute code after finishing all $.getJSON calls, including inner ones, and ones in loops?

I've got this code.

$.getJSON("/some-path.json",function(resultArray){
  for (var j = resultArray.length - 1; j >= 0; j--){
    $.getJSON(resultArray[j],function(resultObject){
      // Bunch of stuff happens here
    });
  }
}).done(function(){
  // This should execute only after ALL $.getJSON codes above finish
});

But the code in .done() runs before all the .getJSON() stuff finishes. How do I make the code in .done() execute AFTER the .getJSON() stuff finishes?

Upvotes: 0

Views: 229

Answers (1)

CertainPerformance
CertainPerformance

Reputation: 370689

I'd use async/await syntax, and use Promise.all to wait for all of the inner fetches to complete:

(async () => {
  const resultArray = await $.getJSON("/some-path.json");
  await Promise.all(resultArray.map(
    url => $.getJSON(url, (innerResult) => {
      // Bunch of stuff happens here
    })
  ));
  // all inner results have completed
})();

Upvotes: 1

Related Questions