11.12.2012 Views

JavaScript 2.0-The Complete Reference, Second ... - freecodingtutorial

JavaScript 2.0-The Complete Reference, Second ... - freecodingtutorial

JavaScript 2.0-The Complete Reference, Second ... - freecodingtutorial

SHOW MORE
SHOW LESS

Create successful ePaper yourself

Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.

Form Fields<br />

HTML supports a variety of form elements, including single-line and mutiline text boxes,<br />

password fields, radio buttons, checkboxes, pull-down menus, scrolled lists, hidden fields, and<br />

numerous types of buttons. This section presents a short review of each of these tags and<br />

shows how <strong>JavaScript</strong> can be used to access and modify their properties.<br />

Common Input Element Properties<br />

All tags are represented in the DOM as HTMLInputElement objects. <strong>The</strong>se objects<br />

share a number of properties related to their functionality as form fields, as well as the (X)HTML<br />

standard properties you would expect (id, title, lang, and so on.). <strong>The</strong> properties common to all<br />

objects representing tags are shown in Table 14-2. Specific types of input<br />

elements—for example, —have additional properties and methods<br />

specific to the type of input they handle. For example, input with type equal to "image" defines<br />

an src attribute, which is undefined with other type values.<br />

Table 14-2: Properties and Methods Common to All Objects Representing <br />

Tags<br />

Property Description<br />

AccessKey String holding the accelerator key that gives the element focus as set by<br />

the accesskey attribute. Note the case difference.<br />

defaultValue String holding the contents of the value attribute when the page loaded.<br />

Disabled Boolean value indicating whether the user can interact with this field.<br />

This can be set by the disabled (X)HTML attribute.<br />

form Read-only reference to the Form containing this field.<br />

name String containing the name of the field as defined by the name attribute.<br />

<strong>The</strong> id attribute and corresponding id property are also used.<br />

Size Commonly used for type set "text" or "password", in which case<br />

it specifies the width in characters. So type values like "radio" or<br />

"checkbox" do not support this attribute while image may define size in<br />

pixels.<br />

TabIndex Integer indicating the field's position in the document's tabbing order as<br />

defined by the tabindex atribute.<br />

type String indicating what kind of form input field the element represents.<br />

Valid values are "text", "password", "button", "image", "submit", "reset",<br />

"radio", "checkbox", "hidden", and "file".<br />

Blur() Causes the field to lose focus.<br />

focus() Brings the field into focus for user input.<br />

A few properties do require some brief discussion. First, the form property references the Form<br />

object that element is enclosed within. So, given<br />

<br />

<br />

<br />

the value of document.myform.field1.form is the Form object named myform. Of course, you<br />

might wonder about the usefulness of this, since we knew the form name to access the

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!