0

I'm working on a page that has a number of draggable "nodes" on it, each with a numeric ID. I create these based on some server-side data I get:

for(var nodeid in data) { // data fetched by AJAX request

    // makeHTML generates an HTML snippet with ID #node-{nodeid}
    $("body").append(makeHTML(nodeid));

    // make nodes draggable, calling node action on stop
    $("#node-" + nodeid).draggable({
        stop: function(event, ui) {
            performAction(nodeid);
        }
    });
}

The objects all appear on the page and are labeled/given IDs as I expect, but whenever I drag something, it always calls performAction() with the last ID in the loop, rather than the ID associated with the dragged object.

Is there a reason nodeid isn't being passed to performAction() properly? Do I need to declare something about the loop differently?

Tim
  • 59,527
  • 19
  • 156
  • 165
  • See this question and the accepted answer: http://stackoverflow.com/questions/341723/event-handlers-inside-a-javascript-loop-need-a-closure. – jimw May 12 '12 at 18:41
  • Thanks for the info - that answer worked for me. Voted to close. – Tim May 12 '12 at 18:58

0 Answers0