Question

Consider the following example:

<form action="process.php" id="myForm">
 ..... 
 ....... all my form elements
</form>

I first accessed my form elements this way:

function verifyForm() {
    var frm_elements = myForm.elements;
    //do something here
}

The above code worked well with the latest versions of Chrome and Internet explorer. However it always failed with Firefox. FF complained about the error : “Could not find the id myForm”

To get this working I replaced myForm.elements with document.getElementById(‘myForm’).elements. It worked fine all the three browsers I tested.

I am just curious to know why did it fail on FF? Did I do anything wrong ?

Answer 1

modify this

<form action="process.php" id="myForm">

to this

<form action="process.php" name="myForm">

Because the DOM forms collection works off of name, therefore to access using the form name you need to add the name attribute to the tag. Which will allow the following statements to work.

document.forms["myform"]
document.forms.myform
document.myform

Here is some reference http://www.quirksmode.org/js/forms.html