Accessing the form elements

The form validation script needs to access the form in the HTML page to determine
what values the user has filled in. So first we have to enter the form by means of the Level 0 DOM.

The general syntax for accessing a form element is:

document.forms[number].elements[number]

                 When the page is loaded, JavaScript makes an array forms in which it puts all the forms that are on the page. The first form is forms[0], the second is forms[1] etc.

                 Each form has another array in which JavaScript puts all the elements in the form.
The first elements is elements[0], the second elements[1] etc. Every <input>, <select> and <textarea> is an element.

                 In some cases, it’s better to use the names of the forms and elements. In HTML, you have to give a name to each form and each element, like:

<form name=”personal” action=”something.pl” onsubmit=”return checkscript()”>

<input type=text size=20 name=name><input type=text size=20 name=address>

<input type=text size=20 name=city>

</form>

                Now you can access these elements by:

document.personal.namedocument.personal.addressdocument.personal.city

                 The advantage of using names is that you can put all elements somewhere else in the page and still have a working script, while a script using numbers will have to be changed. After all, the input box city is document.forms[0].elements[2] in the example above, but when you suddenly put it at the top of the form, it becomes document.forms[0].elements[0] and you have to change the script.

                 When you start writing your own scripts using the code snippets below, it is always very important to know exactly how your form is built. To help you, I wrote a form printing script that
prints out the form structure for you.

Like to share it

No comments

Leave a Reply

Your email address will not be published. Required fields are marked *