Javascript Onclick Problem with Table Rows
Posted
by Shane Larson
on Stack Overflow
See other posts from Stack Overflow
or by Shane Larson
Published on 2009-01-18T02:19:27Z
Indexed on
2010/03/21
10:21 UTC
Read the original article
Hit count: 539
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
© Stack Overflow or respective owner