working on some getJSON and wait until finish

Question

I have a script on some getJSON, please help the solution.

$.getJSON('data1_get.php', {dbase: 'file1', param: '0'}, function(data_1) {
  $.getJSON('data2_get.php', {dbase: 'file2', param: '1'}, function(data_2) {
    for (var i=0; i<data_1.length; i++) { // about 4 rows
      for (var k=0; k<data_2.length; k++) { // about 7 rows
        if (data_1[i].type == data_2[k].type) {
          if (data_2[k].switch=="1") { // possible many process
            // check.php needed time about 3 seconds for 1 process
            $.getJSON('check.php', {param: data_2[k].turnOn}, function(data_3) {
              // not work
              if (data.status) {
                alert('working for '+data_2[k].title);\n";
              }
            });
          }
        }
      }
    }
  });
});

my question is : How can i force it to wait and not continue until we get all the call backs from the ajax requests ?

Thanks!

Why would you want to force it to wait? You'll freeze the browser until it's complete if you do. — , Feb 25 '12 at 04:04
Why bother with ajax if its at first run? Why not perform the operations in the php files youre calling and the jsut spit out the json result in the head of the document like: `` — prodigitalson, Feb 25 '12 at 04:17
First time i used PHP operations, but some PHP array (mySQL data) used operate with javascript. And process more domination by jQuery. — user1232007, Feb 25 '12 at 04:36

score 0 · Accepted Answer · answered Feb 25 '12 at 04:04

If I understand correctly, you want to execute a callback after a response has been received for each item. In the callback, I would increment a counter after every response is received and check if the counter is the same as the total number of items. If it is, call the final callback. JavaScript is single-threaded, so there are no concurrency issues.

score 0 · Answer 2 · edited May 23 '17 at 11:44

You can use $.ajax and with async: false, as explained e.g. here:

Is there a version of $getJSON that doesn't use a call back?

However, look at the documentation:

http://api.jquery.com/jQuery.ajax/

where (for async parameter) it says this, as expected:

Note that synchronous requests may temporarily lock the browser, disabling any actions while the request is active.

That is, if you do what you want, you will potentially block the browser until all requests finish. As you seem to imply there's a lot of things going on, this will potentially forbid the user to do pretty much anything on your page for a long period of time. Not a good thing for user experience...

Asynchronous calls are a much better alternative - they don't block the browser user interface, but you would have to manage the loop-unrolling yourself, unfortunately that's the price of responsiveness... What you need to do to achieve this is to first make a list of parameters for all calls you want to make and then asynchronously call them one by one, making another call in the callback function. Take a look at this plugin which you can use for this:

http://docs.jquery.com/AjaxQueue

score 0 · Answer 3 · answered Feb 25 '12 at 04:10

Basically, you'll want to utilize callbacks.

In jQuery, it might be something like this:

$.ajax("/someresource", {
    success: function() {
       $.ajax("/somethingelse", {
           success: function() {
               alert("This happens after the request completes with a 200!");
           }
       });
    }
});

Refer to the jQuery Ajax docs for more information. Remember that functions like get, post, and getJSON will defer to this function so they will behave similarly.

score 0 · Answer 4 · answered Feb 25 '12 at 04:38

0

Also take a look at jQuery.deferred() as that may help you.

answered Feb 25 '12 at 04:38

SenorAmor

3,351
16
27

working on some getJSON and wait until finish

4 Answers4