Question

for (var i = 0; i < max; i++) {
   deleteButton[i].addEventListener('click', function (e) {
                    AddPatientVitalsModel.globalData.splice(i, 1);
    });
}

When i click on a button, a new table is added… i change some information in table and again add another table… and i delete this table… but the array value does delete the first index alone.

The Value of i is always zero and it deletes the first item in the Array. How can i ensure that for each table it has different ID.

For each click i feel so that i value always starts from Zero….

Answer 1

You’re overwriting the value of i at each loop. You could use an anonymous function to pass the variable by value:

for (var i = 0; i < max; i++) {
    (function(i){ //i is now defined within the scope of this anonymous function
        deleteButton[i].addEventListener('click', function (e) {
            AddPatientVitalsModel.globalData.splice(i, 1);
        }, true);
    })(i); //Pass i to the anonymous function
}

Note that i can have a different name inside the anonymous function, without making a difference.

ANother notice: Pass three arguments to addEventListener, because many browsers will throw an error if the third argument is omitted.