| home / programming / professional / chap6/ 1 | [previous] [next] |
|
|
When you access a form, you usually actually want to access one or more of its elements. In itself that's easy. Each form object has an elements[] array object as a property, which works in the same way as the forms[] array. Once again document.forms[0].elements is only an array – to actually access the element of your choice, you must specify it. For example, to access the input field named input1 in the first form, we can use any of these four references:
document.forms['firstform'].elements[0]
document.forms['firstform'].elements['input1']
document.forms[0].elements[0]
document.forms[0].elements['input1']
There are several types of form elements, and it's best to divide them into four groups:
The text fields (text, textarea, hidden, and file). You may want to read out the data the user has entered or write new text to these elements.
The checked elements (checkbox and radio). You may want to see if these are checked, or check/uncheck them yourself.
The buttons (button, reset, and submit). You rarely want to do anything with these.
The select element, which forms a group of its own. Each select box has one or more options. Select boxes have become powerful navigation tools and sometimes you want to change their options extensively.
These are some of the properties and methods of individual form element objects.
Property |
Form Elements Applicable To |
Read/write |
Description |
checked |
Checked elements |
read/write |
Returns a Boolean that is true when the element is checked, and false when it isn't. |
| disabled |
All elements, except hidden |
read/write |
Returns a Boolean. When set to true, the form field is disabled: the user cannot change anything. Supported by IE 4+, Netscape 6+, Opera 6+, iCab, and Konqueror. |
| form |
All elements |
read-only |
Returns a reference to the form the element is a part of. |
| length |
Select |
read-only |
Returns the number of options in the element |
| name |
All elements |
read-only |
Accesses the name attribute of the element |
| selectedIndex |
Select |
read/write |
Returns the index number of the currently selected option |
| type |
All elements |
read-only |
Gives the type of the element. Its value is the same as the type attribute of the form field, except that: 1) <select> elements can be of two types: select-one (if attribute multiple is set to false) or select-multiple 2) A <textarea> element has type textarea |
| value |
All elements |
read/write. |
Accesses the value
attribute of the element. If you set the content of a text element, it
shows this value. |
| Method |
Form Elements Applicable To | Description |
| blur() |
All elements, except hidden |
Takes the focus away from the element. |
| click() |
All elements except text |
Simulates a mouse click on the element. |
| focus() |
All elements, except hidden |
Gives the element focus. |
| select() |
Text elements, except hidden |
Selects all text in the element. |
| home / programming / professional / chap6/ 1 | [previous] [next] |
Created: March 11, 2003
Revised: March 11, 2003
URL: http://webreference.com/programming/professional/chap6/1