Waiting for ajax responses to fill object

Question

I'm using AJAX to get some values from a server and I'm doing it asynchronously. How can I stop somehow to wait until the AJAX request ends? This is my code:

var response = {}
for (var i = 0; i < length; i++){
        $.ajax({
            url : url[i],
            dataType : 'json'
        }).success(function(result) {
            processResult(result);
        })
}

I figured I should create a function to wait, but it doesn't work properly:

function wait() {
    for (var name in response) {
        if (response[name] === undefined) {
            setTimeout(function() {
                wait()
            },50)
        }
    }
    processResult(); //this is function where I will process my AJAX result
}

Can anyone help me?

Do you mean code running whilst your ajax is loading? Anything in your success handler is being called when your ajax request has finished executing. You just need to call processResult() inside your success handler — Alex, Nov 27 '12 at 16:07
I don't get it. the function inside success is supposed to be called only when the request is over no? — Py., Nov 27 '12 at 16:08
looks like scope issues, try declare function as variable, var wait = function ... — dmi3y, Nov 27 '12 at 16:08
yes I use this function to fill some data but I can fill data without getting them from AJAX — Krystian, Nov 27 '12 at 16:09
Ah, I think the op means after all of the requests have finished. As stated above, http://api.jquery.com/ajaxComplete/ might help — Alex, Nov 27 '12 at 16:10
sorry it's pseudocode - my application is much more complicated and I dont want do pass ~400lines of code so I simpified problem. — Krystian, Nov 27 '12 at 16:10
@socialrel8 but It fires up after *every* single request has ended but I want to lunch function after all requestes were complete — Krystian, Nov 27 '12 at 16:12

score 1 · Answer 1 · answered Nov 27 '12 at 16:12

1

As it's probably the answer, I'll post it here. I think you're looking for:

http://api.jquery.com/ajaxComplete/

You can use this to find out when all of your ajax has completed and then do something with the response.

answered Nov 27 '12 at 16:12

Alex

7,320
1
18
31

can you give me example how can I use it to wait for all ajax requests ended? – Krystian Nov 27 '12 at 16:16

Krystian · Accepted Answer · 2012-11-29T10:30:07.540

OK I figured it out. Because ajaxComplete is launching after every single AJAX request as I said before I had to create function that will wait until all request have been done. So I did it like this:

I changed my function:

var response = {}
for (var i = 0; i < length; i++){
        $.ajax({
            url : url[i],
            dataType : 'json'
        }).success(function(result) {
            processResult(result);
        })
}

to:

    response = {}
    for (var i = 0; i < length; i++){
      callAJAX(url[i]);
    }
_wait4ajax();

function callAJAX is like this:

function callAJAX(url){
            $.ajax({
                url : url[i],
                dataType : 'json'
            }).success(function(result) {
                processResult(result);
            })
}

and _wait4ajax is function where I check if all properties of object aren't undefined so: (I've got lists of properties which should be filled in object - this property is in visibleLayers array

function _wait4ajax(){
        var controlArray = [], self = this;

        var length = this.visibleLayers.length;
        for (var i = 0; i < length; i++) {
            if (this.cachedFeatures[this.visibleLayers[i]] === undefined) {
                controlArray.push('false');
            } else {
                controlArray.push('true');
            }
        }
        if (controlArray.indexOf('false') != -1) {
            setTimeout(function() {
                self._wait4ajaxComplete();
            }, 50);
        } else {
            //AJAX has ended - Object is ready
        }
}

I messed up my pseudocode (created for this site purpose) with actual code from my project, so it will probably doesn't work in this form, but I want to specify specific idea of this subject. fill free to edit this post. :)

score 0 · Answer 3 · edited May 23 '17 at 12:31

0

The answer for this question will do what you want:

How can I get jQuery to perform a synchronous, rather than asynchronous, Ajax request?

Your code:

var response = {}
for (var i = 0; i < length; i++){
        $.ajax({
            url : url[i],
            dataType : 'json',
            async:   false,
            success: function(result) {                
                processResult(result);
            }
}

edited May 23 '17 at 12:31

Community

1
1

answered Nov 27 '12 at 16:11

Brett

579
3
10

I can't do this in sync mode because my application is freezing until ajax is complete and this is what I wanna to avoid. – Krystian Nov 27 '12 at 16:14

Waiting for ajax responses to fill object

3 Answers3

Linked