handle responses of multiple parallel ajax requests
<p>I have 4 parallel jQuery ajax requests towards my service (jsonp), and everything works fine until the data is returned from service and needed to be displayed to user. I'm not able to handle responses, since they all arrive in interval of just a few milliseconds, and they call the same jsonp callback method. </p>

<p>What I want to do is update data box when each one of ajax request complete its job. </p>

<p>Code example:</p>

<pre><code>$.ajax({
   url: 'http://link/service?source=1',
   dataType: 'jsonp',
   jsonp: 'callback',
   jsonpCallback: 'asyncPrint'
   complete: function(data) {
      console.log("completed");
   }
});

$.ajax({
   url: 'http://link/service?source=2',
   dataType: 'jsonp',
   jsonp: 'callback',
   jsonpCallback: 'asyncPrint'
   complete: function(data) {
      console.log("completed");
   }
});

$.ajax({
   url: 'http://link/service?source=3',
   dataType: 'jsonp',
   jsonp: 'callback',
   jsonpCallback: 'asyncPrint'
   complete: function(data) {
      console.log("completed");
   }
});

$.ajax({
   url: 'http://link/service?source=4',
   dataType: 'jsonp',
   jsonp: 'callback',
   jsonpCallback: 'asyncPrint'
   complete: function(data) {
      console.log("completed");
   }
});
</code></pre>

<p>In other file I have implemented asyncPrint method:</p>

<pre><code>function asyncPrint(data) {
   if(data == undefined) return;

   //Populate sourceMedia with data from all sources
   sourceMedia[data.list[0].source] = data;

   //Do something with arrived data
   goThroughArrivedData(data);
}
</code></pre>

<p>P.S. 
I've tried with $.when(), but than it wait for all ajax requests to complete, which is unacceptable, since one of the ajax calls can take more than 30 seconds.</p>
