Passing variables to functions within events within loops

Question

How can I pass the right variables for the map on the inner click event? Essentially I have information that I pass to a function fooFunc using a map bound to a click event. I generate the click functions in the loops because there are many objects they need to be generated for.

The map is complicated because I need to pass some things on the object and some things that the user selects.

for (i = 0; i < providers.length; i++) {
    var tNeeded = $("#select"+i).val();
    var type = $("#select"+i).find('option:selected').text();
    $("#select"+i).on("change", function() {
        tNeeded = $(this).val();
        type = $(this).find('option:selected').text();
        $("#target"+i).click({timeNeeded:tNeeded, timeType:reason, objectId:object[i].id}, fooFunc);
   });
   $("#target"+i).click({timeNeeded:tNeeded, timeType:reason, objectId:object[i].id}, fooFunc);
}

The definitions outside the change event are in case the user clicks the target without changing anything in the select box. Right now when the change event is triggered the objectID takes the last object's ID instead of the ID associated with the target click. How can I pass this ID along with the change function?

score 0 · Answer 1 · answered Jan 08 '16 at 20:30

I would modify fooFunc so that it accepts the arguments you want. Then, I would create another function like this:

function makeFooFunc(arg1, arg2) {
    return function fooFuncCaller(e) {
        return fooFunc(arg1, arg2, e);
    }
}

And call it like this:

$("#target"+i).click(makeFooFunc(arg1, arg2));

Using functional programming to get the job done.

Passing variables to functions within events within loops

1 Answers1