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?

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?

• javascript
• jquery
• ajax

• 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 Commented Nov 27, 2012 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. Commented Nov 27, 2012 at 16:08
• looks like scope issues, try declare function as variable, var wait = function ... – dmi3y Commented Nov 27, 2012 at 16:08
• 1 jQuery's $.ajax has a plete method – ajtrichards Commented Nov 27, 2012 at 16:08
• yes I use this function to fill some data but I can fill data without getting them from AJAX – Krystian Commented Nov 27, 2012 at 16:09

3 Answers 3

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

http://api.jquery./ajaxComplete/

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

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. :)

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);
            }
}