INPUT tag

Available in versions: 2.0, 3.2, 4.0
Browser compatibility: Explorer 4, 5 Netscape 4, 6

The tag is used to create individual form controls (fields). Control is a technical term that refers to the various elements (buttons, check boxes, radio buttons, text areas) that can be used inside a form to gather information.

The four tags that can be used to build a form are:

button, input, select, textarea

The form is the heart of an e-commerce page and the input tag is the heart of a form. There are ten types of form controls that can be created using the input tag. Appropriately, you must use the type attribute to determine the specific type of the control (field). The types are:

button
checkbox
file
hidden
image
password
radio
reset
submit
text

Any number of input tags can be placed anywhere between a pair of opening and closing form tags to create the desired appearance of the form.

There is no closing tag.

Core Attributes

class dir id lang onclick ondblclick onkeydown onkeypress onkeyup onmousedown onmousemove onmouseout onmouseover onmouseup style title

Attributes

accept
The accept attribute is used with the type="file" control to specify what kind of files (including the path) that can be attached to the form. It is a comma-delimited list. For example: accept="images/*.gif"

accesskey
The accesskey attribute allows you to designate a key on the keyboard that when pressed, along with the alt or meta key, will bring focus to the input form element. This attribute is poorly supported.

align deprecated 4.0
The align attribute is used with a type="image" control to place the image with respect to any surrounding text. The permitted values are bottom, left. middle, right, and top. This attribute is deprecated effective with version 4.0. However, most browsers continue to recognize this attribute. You are now to use style sheets.

alt
The alt attribute displays an alternative text for browsers that cannot display an image.

checked
The checked attribute is a Boolean value that, if present, allows a checkbox or radio button to be preselected (and have a preselected value).

disabled
The disabled attribute is a Boolean value that, if present, prevents the form control (field) from functioning. In some browsers, the control (field) will appear to be greyed out.

ismap
The ismap attribute is a Boolean value that, when present, signifies that the image is being used as a mouse-clickable server-side image map.

maxlength
The maxlength attribute sets the maximum number of characters that can be entered into a one line text window.

name
The name attribute is a string of characters that is used to label a form control (field) with a name. The name must be unique to that document and cannot be reused.

onblur
The onblur attribute is an event that allows the execution of JavaScript code when an element loses focus (for example, the mouse was clicked onto another element or a tab navigation directed the cursor elsewhere).

onchange
The onchange attribute is an event that allows the execution of JavaScript code when the form control (field) has been changed and loses focus.

onfocus
The onfocus attribute is an event that allows the execution of JavaScript code when an element comes into focus (for example, the mouse was clicked onto the element or a tab navigation brought the cursor to the element).

onselect
The onselect attribute is an event that allows the execution of JavaScript code when the form control (field) gains focus.

readonly
The readonly attribute allows you to display a value in a form control (field) that cannot be changed by the user.

size
The size attribute sets the width of a one line text window by defining how many characters can fit in the window.

src
The src attribute is the URL address or directory/file (path/name) where an image file is being stored.

tabindex
The tabindex attribute specifies an integer that defines the rank in the tabbing order for the specified element when you use the keyboard to navigate (tab through) a page. This attribute is poorly supported.

type
The type attribute determines the specific control.

Note that by using style sheets you can effect the appearance of the various types of controls. However, the exact appearance will be browser dependent.

type="button"
The type="button" control creates a rectangular button that can be clicked when you wish a desired action to occur. For example, you could use buttons to navigate through a recordset data source being displayed on a web page. (See the RDS objects in the ADO Quick Reference.) If you want to reset or submit the form, you should use the type="reset" and type="submit" controls.

A value for the name attribute is required. You can use the value attribute to assign a text that will be displayed on the face of the button. The default color is gray, but that can be changed using style sheets (see example at bottom of page). The text displayed on the button will set the minimum size, but you can set a different size using style sheets or the size attribute.