How to pass a local variable to a promise done function

Question

I have the following script, which runs 5 ajax requests and tells when they are done. All that using jQuery promises and $.where.

http://jsfiddle.net/r269j65r/

console.info('Creating promises: start');
var p = [];
for(var i=0; i<5; i++) {
    a = $.when( x(i) ).done(function(){
        console.log('Promise ' + i + ': done');
    });
    p.push(a);
}
console.info('Creating promises: done');
console.log('Running promises: start');

$.when.apply($,p).done(function(){
    console.log('Running promises: done');
});

function x(i) {
    console.log('Promise ' + i + ': start');
    return $.ajax({
        'url' : '/'         
    })
    .done( function() {
    });
}

The problem is that console.log('Promise ' + i + ': done'); always returns Promise 5: done, because i-variable has value 5 when the done() function is executed.

My question is what be a good and clean way to give i to the context of the done()-function in the for-loop?

Just put it in that `x` function. – Bergi Jun 25 '15 at 22:56 — Bergi, Jun 25 '15 at 22:56

score 3 · Accepted Answer · answered Jun 25 '15 at 22:12

You need to use closure to make this work (Closures on MDN)

A working fragment:

for(var i=0; i<5; i++) {
    (function(i){
        a = $.when( x(i) ).done(function(){
            console.log('Promise ' + i + ': done');
        });
        p.push(a);
    })(i);
}

And the full fiddle...

How to pass a local variable to a promise done function

1 Answers1