0

My requirement is to call 3 ajax call in parallel then only on complete of the 3 calls , I am requesting one more Ajax call. So for i am able to achieve this by the following this article by Chris from CSS-trick

`$.when(
  $.get("url1"), //goes in parallel
  $.get("url2"), //goes in parallel
  $.get("url3") //goes in parallel
).then(
  $.get("url4") // fires only on completion of 3 calls above.
);`

But my code stuructre is like

`$.when(
   threeCalls(){
   //this gives 3 ajax calls from here
})
.then(
   singlecall(){
   //this shoould be only called after 3 calls been successfull
})`

This way it does not wait for the singlecall() to wait for the threecalls() method to finish and all calls(4 of them) goes in parallel/async.

How i should achieve this?

SumanP89
  • 119
  • 1
  • 4
  • 13

2 Answers2

0

The example below shows how to use sequential calls with functions.

Rather than: when(singleCall()), do it like when(singleCall); without parantheses. Or, it will execute the function before the promise resolves.

// just open up the network tab in your browser and see that
// first 3 urls will go in parallel in threeCalls,
// and then the last url will go in singleCall

function threeCalls() {
  console.log("calling urls in parallel...");
  return [ 
    $.get("http://jsonplaceholder.typicode.com/posts/1"),
    $.get("http://jsonplaceholder.typicode.com/posts/2"),
    $.get("http://jsonplaceholder.typicode.com/posts/3")
  ];
}

function singleCall(results) {
  console.log("single call is here");
  return $.get("http://jsonplaceholder.typicode.com/posts/4");
}

$.when.apply($, threeCalls())
 .done(singleCall)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Inanc Gumus
  • 25,195
  • 9
  • 85
  • 101
  • might be a stupid question, but what kind of array `threecalls()` fuunction should return @inanc – SumanP89 Sep 05 '16 at 17:29
  • That is perfect, just what needed. But still the deferred thing goes blank in my mind, will grab the concept soon. – SumanP89 Sep 06 '16 at 17:27
  • how to make sure that the call to `onecall()` always happen irrespective of `threecalls()` fails or success? I have tried always in place of done but not worked as expected. – SumanP89 Sep 06 '16 at 17:55
  • hmm. But how to make sure to run `onecall()` always.... irrespective of `threecalls()` fails or success? .fail catches fail only...isn't it – SumanP89 Sep 06 '16 at 18:20
  • pretty much solved by this http://stackoverflow.com/questions/5824615/jquery-when-callback-for-when-all-deferreds-are-no-longer-unresolved-either – SumanP89 Sep 06 '16 at 18:22
  • @SumanP89 yeah. that's what i'm talking about. but, promises are a kinda vast topic in itself. that many tricks. this is just the tip of the iceberg :) – Inanc Gumus Sep 06 '16 at 18:59
  • @SumanP89 btw, can you change the title of the question? so, the others can see what this solution actually solves. like this maybe: how to use multiple sequential jquery deferreds within functions – Inanc Gumus Sep 06 '16 at 19:03
0

This will be more readable and functional (do not use parentheses on call4 in then)

var call1 = $.ajax({}),
    call2 = $.ajax({}),
    call3 = $.ajax({}),
    call4 = $.ajax({});

$.when( call1, call2, call3 )
 .then( call4 );