Binding click event handlers in a loop causing problems in jQuery

Question

I am trying to run the following code:

I pass parameter to a function, but it always has the value of the last object run through the loop. I read some articles abou

Answer 1

It is a scope problem. By the time the event handler function is executed, the value of parentId has changed and is not longer what you expected.

This can be solved making the original event handler function be returned by another function which, in turn, is passed the value of parentId as argument:

function getEventHandlerFunction(id){
    return function() {
        alert(id);  // variable found in the closure with the expected value
    };
}


aDisplayCol.bind('click', getEventHandlerFunction(parentId));