Using document.getElementsByName() isn't working?
The code for the second alert command works as intended (displaying the value of the element "to", but the first alert command does not work (it's supposed to do the same thing). Why is this?
<html>
<head>
<script type="text/javascript">
function getValue()
{
alert(document.getElementsByName("to").value);
alert(document.forms[0].to.value);
}
</script>
</head>
<body>
<form>
<input name="to" type="hidden" value="hoolah" />
<input type="button" onclick="getValue()" value="Get Value!" />
<form/>
</body>
</html>
getElementsByName returns an HTMLCollection. You can access the value of the first item like this:
document.getElementsByName("to").item(0).value
Or like this:
document.getElementsByName("to")[0].value
More info:
- https://developer.mozilla.org/en/DOM/HTMLCollection
getElementsByName returns all elements with the given name. This means there can be more than one.
If you want to get the value of the first element:
document.getElementsByName("to")[0].value