JavaScript® Bible, Sixth Edition

Chapter 9. Forms and Form Elements

IN THIS CHAPTER

• What the form object represents

• How to access key form object properties and methods

• How text, button, and select objects work

• How to submit forms from a script

• How to pass information from form elements to functions

Most interactivity between a web page and the user takes place inside a form. That's where a lot of the interactive HTML stuff lives for every browser: text fields, buttons, checkboxes, option lists, and so on.

As described in earlier chapters, you may use the modern document object model (DOM) document.getElementById() method to reference any element, including forms and form controls. But this chapter focuses on an older, yet equally valid way of referencing forms and controls. It's important to be familiar with this widely used syntax so that you can understand existing JavaScript source code written according to the original (and fully backward-compatible) form syntax: the so-called DOM Level 0 syntax.

The form Object

Using the original DOM Level 0 syntax, you can reference a form object either by its position in the array of forms contained by a document or by name (if you assign an identifier to the name attribute inside the <form> tag). If only one form appears in the document, it is still a member of an array (a one-element array) and is referenced as follows:

document.forms[0]

Or use the string of the element's name as the array index:

document.forms["formName"]

Notice that the array reference uses the plural version of ...