function error if trigger is inside a form

[jak]

Hello,

I have the following javascript code:

<script type="text/javascript">
function key(){
	var text = document.getElementById("name");
	var res1 = text.value.replace(/&/g, ",");
	var res2 = res1.replace(/&amp;/g, ",");
	var res3 = res2.replace(/ /g,",");
	document.getElementById("key").value = res3;
}
</script>

and

<input id=name type=text name=name value="a&b">
<input id=key type=text name=key value="">
<input type='button' onclick="key()" value='check'>

Everthing is ok unless I put the HTML inside <form> tags.

So the above code is working but the below code:

<form>
<input id=name type=text name=name value="a&b">
<input id=key type=text name=key value="">
<input type='button' onclick="key()" value='check'> 
</form>

generates a "Object doesn't support this property or method" error.

Why? What am I doing wrong and how can I correct it?

Thank you

[Kor]

You have both a function and an element name (and id) named the same: key. Change one of them.

Within a form, elements may be referred straight upon their name, as they would have been Global variables. But functions are Global variables, as well. So, in your second attempt, you had two variables with the same scope and the same name, which is illegal.

[jak]

You have both a function and an element name (and id) named the same: key. Change one of them.

Within a form, elements may be referred straight upon their name, as they would have been Global variables. But functions are Global variables, as well. So, in your second attempt, you had two variables with the same scope and the same name, which is illegal.

Thank you very much for the clear explanation.