In order to access this site you need to enable JavaScript!

You are here: Reference > JavaScript > client-side > HTML DOM > methods > item (form)

item method (form)

Browser support:

Returns an element or a collection of elements from the elements collection of the current form element by name or by index.

The item method is only supported by Internet Explorer and Opera. For a cross-browser solution, use the item method or the [] operator on the elements collection instead. For details, See the page for the elements collection.

Syntax:

object.item (index [, subIndex]);

You can find the related objects in the Supported by objects section below.

Parameters:

index

Required. String or zero-based integer that specifies the element or elements to retrieve.

If an integer value is specified, it specifies the index of the element to retrieve. The first index is zero.
If this parameter is a string, then it specifies a value for the name or id property of the element or elements to retrieve.

subIndex

Optional. Supported by Internet Explorer only.

If more than one matching element is found for the index parameter (possible only if it is a string), the item method creates an elements sub-collection filled with the matching elements. In that case, the subIndex property specifies the position of the element in the sub-collection to retrieve. In other cases, the subIndex property has no meaning.

Return value:

If no match is found, it returns null. If exactly one match is found, it returns the matching element. If more than one match is found, it returns an elements sub-collection filled with the matching elements.

Example HTML code 1:

This example illustrates the use of the item method:

<head>
    <script type="text/javascript">
        function GetByNameAndByIndex () {
            var form = document.getElementById ("myForm");

            if (form.item) {    // Internet Explorer, Opera
                var firstItem = form.item (0);
                alert ("The first control in the form:\n" + firstItem.innerHTML);

                var myInputs = form.item ('myInput');
                alert ("The number of controls with name='myInput': " + myInputs.length);
                alert ("The first control with name='myInput':\n" + myInputs[0].value);
            }
            else {
                alert ("Your browser doesn't support the item method.");
            }
        }
    </script>
</head>
<body>
    <form id="myForm">
        <span>Click on this button:</span>
        <button onclick="GetByNameAndByIndex ();">Get form controls by name and by index</button>
        <br /><br />
        <input name="myInput" size="40" value="First input field" />
        <br />
        <input name="myInput" size="40" value="Second input field" />
    </form>
</body>

Copy Code

Preview

Syntax Highlighter

Did you find this example helpful? yes no

Example HTML code 2:

A cross-browser solution for the previous example:

<head>
    <script type="text/javascript">
        function GetByNameAndByIndex () {
            var form = document.getElementById ("myForm");

            var firstItem = form.elements[0];
            alert ("The first control in the form:\n" + firstItem.innerHTML);

            var myInputs = form.elements['myInput'];
            alert ("The number of controls with name='myInput': " + myInputs.length);
            alert ("The first control with name='myInput':\n" + myInputs[0].value);
        }
    </script>
</head>
<body>
    <form id="myForm">
        <span>Click on this button:</span>
        <button onclick="GetByNameAndByIndex ();">Get form controls by name and by index</button>
        <br /><br />
        <input name="myInput" size="40" value="First input field" />
        <br />
        <input name="myInput" size="40" value="Second input field" />
    </form>
</body>