jQuery. obtain var from ajax in cycle

Question

for (var i = 0; i < 3; i++){
    $.ajax({
        url: "ajax.php",
        success: function(data){
            alert(i);
        }
    });
}

I need a solution to get alerts with "0", "1" and "2". Аt this time of course I see 3 alerts with "3".

Try saving the value `i` into a temporary variable (e.g. `j`) inside the loop, and using that in the `success` handler. — millimoose, Feb 24 '12 at 13:34
possible duplicate of [Variable in JavaScript callback functions always gets last value in loop?](http://stackoverflow.com/questions/2520587/variable-in-javascript-callback-functions-always-gets-last-value-in-loop) — Quentin, Feb 24 '12 at 13:36
@Inerdial — That will just create (and overwrite) a variable that is always a copy of i (or lagging very slightly behind it). — Quentin, Feb 24 '12 at 13:37

score 4 · Accepted Answer · answered Feb 24 '12 at 13:34

You need to put a closure around your $.ajax() call.

for (var i = 0; i < 3; i++){
    (function (loop_var) {
        $.ajax({
            url: "ajax.php",
            success: function(data){
                alert(loop_var);
            }
        });
    })(i);
}

Currently it is outputting 3 as my the time the Ajax returns the value of i is indeed 3.

score 2 · Answer 2 · answered Feb 24 '12 at 13:36

Use an anonymous function wrapper around the code to create a closure that will keep the value until the asynchronous response arrives:

for (var i = 0; i < 3; i++){

  (function(i){

    $.ajax({
      url: "ajax.php",
      success: function(data){
        alert(i);
      }
    });

  })(i);

}

score 0 · Answer 3 · answered Feb 24 '12 at 13:50

Pass the i value to the ajax.php page as a parameter. The ajax.php page has to return i to the calling page. So let the ajax.php page return i. You can use json objects or a trivial pipe-separated string to store returning values from ajax.php.

for (var i = 0; i < 3; i++){
    $.ajax({
        data: {par: i},
        url: "ajax.php",
        success: function(data){
            //data is a pipe-separated string
            var cnt = data.split("|")[0];
            alert(cnt);
        }
    });
}

jQuery. obtain var from ajax in cycle

3 Answers3