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>

Answers:

Answer

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:

Answer

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
Answer

That's because it puts the element(s) into an array, try this example instead:

function getValues(objName)
{  
    var arr = new Array();
    arr = document.getElementsByName(objName);

    alert("total objects with name \"textfield\" = \n" + arr.length);

    for(var i = 0; i < arr.length; i++)
    {
        var obj = document.getElementsByName(objName).item(i);
        alert(obj.id + " =  " + obj.value);
    }
}

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.