Adding Onclick Event

[johnnyg24]

I am having trouble passing the correct parameter when creating onclick events. This way works, but not for IE

for(i=0;i<doc.getElementsByTagName("shipto").length;i++){radio.setAttribute('onclick', "mimicShipTo(3,"+i+");")}

So then I tried this way:

for(i=0;i<doc.getElementsByTagName("shipto").length;i++){radio.onclick = function(){mimicShipTo(3,i)}}

But this way for some reason passes "i" as 1 and not zero.I know that the function will only loop once in this particular situation.Can anyone tell me why "i" is being passed as 1 and not zero?Thanks

[jeffman]

It's a scope issue. You're hoping that the value of i gets embedded in the function. What does happen is that the variable itself gets embedded. Since the value of i is 1 when the click event fires (the highest it got when the loop terminated) then 1 is what the click handler sees. What you need is a way to set the value of i in a way that persists. Off the top of my head, this might work:

for(i=0;i<doc.getElementsByTagName("shipto").length;i++){	radio.ship_index = i;	radio.onclick = function(){mimicShipTo(3, this.ship_index)}}

ship_index becomes a new property of your radio elements. That's perfectly okay.EDIT: looking at this some more. Is this an XML object you're working with? I ask because "shipto" isn't a regular HTML tag. And where does radio come from? Since it's identity doesn't change with the loop increment, you keep assigning a new function to the same object over and over.

Edited August 31, 2009 by Deirdre's Dad

[johnnyg24]

Deirdie's Dad,Yes, this is an XML doc that I am working with. And "radio" is what I haved called the variable that was created by this function. I should have included the entire function, so here it is. Sorry for the confusion.

function writeShipto(doc){	var placeStr = ""	var table = document.getElementById("shiptoTbl").tBodies[0]	for(i=0;i<doc.getElementsByTagName("shipto").length;i++){		var row = table.insertRow(-1)		var cell1 = row.insertCell(0)		var cell2 = row.insertCell(1)		var radio = document.createElement("input")		radio.setAttribute('name', 'shipto')		radio.setAttribute('type', 'radio')		radio.setAttribute('id', i)		//radio.setAttribute('onclick', "mimicShipTo(3,"+i+");")		radio.onclick = function(){mimicShipTo(3,i)}		placeStr += doc.getElementsByTagName("stname")[i].firstChild.data		placeStr += "<br/>" + doc.getElementsByTagName("staddr1")[i].firstChild.data			if(doc.getElementsByTagName("staddr2")[i].hasChildNodes()){		placeStr += "<br/>" + doc.getElementsByTagName("staddr2")[i].firstChild.data			}		placeStr += "<br/>" + doc.getElementsByTagName("stcity")[i].firstChild.data		placeStr += ", " + doc.getElementsByTagName("ststate")[i].firstChild.data		placeStr += " " + doc.getElementsByTagName("stzip")[i].firstChild.data		cell1.appendChild(radio)		cell2.innerHTML = placeStr	}	}

[jeffman]

Well, no problem then. My advice still works. You can even simplify it, since the id attribute has the number you need. So you might end up with this:radio.onclick = function(){mimicShipTo(3, this.id)}Try it. Either way, you'll learn something.Also:You should probably take those var declarations out of your for loop. You can assign the values there, that's fine. But you should only declare a variable once.EDIT: darn it! This probably won't work without a little more tinkering. If I remember correctly, an element id cannot be or begin with a number. All I'm 100% sure of is I never do it, and it's probably for a reason.

Edited August 31, 2009 by Deirdre's Dad

[roundcorners]

You haven't declared i with var i in your function

[Ingolme]

You haven't declared i with var i in your function

While it's better to declare all variables, it really doesn't matter, since Javascript is very forgiving. That's not going to be the cause of the problem.