Javascript Onclick Problem with Table Rows
- by Shane Larson
Hello. I am having problems with my JScript code. I am trying to loop through all of the rows in a table and add an onclick event. I can get the onclick event to add but have a couple of problems.
The first problem is that all rows end up getting set up with the wrong parameter for the onclick event.
The second problem is that it only works in IE.
Here is the code excerpt...
shanesObj.addTableEvents = function(){
table = document.getElementById("trackerTable");
for(i=1; i<table.getElementsByTagName("tr").length; i++){
row = table.getElementsByTagName("tr")[i];
orderID = row.getAttributeNode("id").value;
alert("before onclick: " + orderID);
row.onclick=function(){shanesObj.tableRowEvent(orderID);};
}}
shanesObj.tableRowEvent = function(orderID){
alert(orderID);}
The table is located at the following location...
http://www.blackcanyonsoftware.com/OrderTracker/testAJAX.html
The id's of each row in sequence are... 95, 96, 94...
For some reason, when shanesObj.tableRowEvent is called, the onclick is set up for all rows with the last value id that went through iteration on the loop (94).
I added some alerts to the page to illustrate the problem.
Thanks.
Shane