Learn about events that can be fired on form events and their uses.
The form property within the document object contains an array of all forms defined within the document.
Each element within the array is a form object , the index number associated with the form object defines the order in which the form appears on the webpage.
The exits a number of events associated with the form element. The table below enumerates them in detail.
Table : Event handlers for Form Elements.
|button||onClick, onBlur, onFocus|
|checkbox||onClick, onBlur, onFocus.|
|FileUpLoad||onClick, onBlur, onFocus|
|password||onBlur, onFocus, onSelect.|
|radio||onClick, onBlur, onFocus|
|select||onFocus, onBlur, onChange.|
|text||onClick, onBlur, onFocus , onChange|
|textarea||onClick, onBlur, onFocus , onChange|
The main utility of a button object is to trigger an event, say an onClick() event, but a button object has no default action.
The are several types of buttons associated with a form:
These events are fired when some click related activity is registered.
Table : The MouseEvent Object.
|Event Handler||Triggered When|
|onBlur||The form's select, text, or textarea field loses focus.|
|onChange||A select , text ot textarea field has lost the focus and values are changed.|
|onClick||An object on a form gets clicked.|
|onFocus||a field gets input focus.|
|onReset||The the form is reset|
|onSelect||text within the textarea field is selected|
|onSubmit||A form is submitted|
The current object is referred using the keyword this, it is used quite frequently with form element.
For forms with multiple input fields, it get easier to refer them using this keyword, than by using full name to call the event handler function.
Using the event handler onClick is the most frequently used in form, or elsewhere to trigger event handler function on click events.
A click event is set to take place when the button within a form, radio or checkbox is pressed or when a selection is made.
The event handler onFocus is fired when a form element gets the focus.
Similarly, the onblur event handler is fired when the form element loses focus, i.e when the cursor moves away from form field
More form related applications will be explained in the chapter on forms.