Webmaster Resources Center

Welcome to the Bravenet Resource Center. Use these resources to help make your web pages more advanced and fun to use.

Articles & Tutorials

Sample Form Elements

by Bravenet.com


Summary : Sample Form Elements

Text Field

Allows users to enter one line of text.

Sample
CODE

Attributes

size

maxlength
name

value

align


tabindex

Defines the width of the field / How many visible character it can contain.
Maximum number of characters allowed.
Gives the field a name so the program that handles the form can identify the fields.
What will appear as the default before the user enters any information.
Defines how the field is aligned. TOP, MIDDLE, BOTTOM, RIGHT, LEFT, TEXTTOP, BASELINE, ABSMIDDLE, ABSBOTTOM.
Defines the order of how different fields should be activated when the visitor clicks the tab key.

Password Field

Similar to a Text Field but what the user enters displays as dots on the screen.

Sample
CODE

Attributes

size

maxlength
name

value

align


tabindex

Defines the width of the field / How many visible character it can contain.
Maximum number of characters allowed.
Gives the field a name so the program that handles the form can identify the fields.
What will appear as the default before the user enters any information.
Defines how the field is aligned. TOP, MIDDLE, BOTTOM, RIGHT, LEFT, TEXTTOP, BASELINE, ABSMIDDLE, ABSBOTTOM.
Defines the order of how different fields should be activated when the visitor clicks the tab key.

Hidden Field

Similar to a Text Field but it does not show on the page. The user can not type anything into the field it is used to submit information that is not entered by the visitor.

CODE

Attributes

name

value

Gives the field a name so the program that handles the form can identify the fields.
What will appear as the default before the user enters any information.

Text Area

Allows users to enter multiple lines of text.

Sample
CODE

Attributes

rows
cols
name

tabindex

wrap



Number of rows in field.
Number of columns in field.
Gives the field a name so the program that handles the form can identify the fields.
Defines the order of different fields should be activated when the visitor clicks the tab key.
'off' turns off line breaking, 'virtual' shows line breaking, but sends text as entered, and 'physical' the text is submitted as it appears on the screen.

Check Box

Allows users to select one or more options from a list of alternatives.

Sample
Favortie Color:
PurpleRed
YellowBlue
CODE

Attributes

name

value
align


tabindex

checked
Gives the field a name so the program that handles the form can identify the fields.
What will be submitted if checked.
Defines how the field is aligned. TOP, MIDDLE, BOTTOM, RIGHT, LEFT, TEXTTOP, BASELINE, ABSMIDDLE, ABSBOTTOM.
Defines the order of how different fields should be activated when the visitor clicks the tab key.
Default checked field.

Radio Button

Allows users to select only one option from a list of alternatives.

Sample
Favortie Color:
PurpleRed
YellowBlue
CODE

Attributes

name


value
align


tabindex

checked
Tells which group of radio buttons the field belongs to. Without this option you can only have on set of radio buttons per page.
What will be submitted if checked.
Defines how the field is aligned. TOP, MIDDLE, BOTTOM, RIGHT, LEFT, TEXTTOP, BASELINE, ABSMIDDLE, ABSBOTTOM.
Defines the order of how different fields should be activated when the visitor clicks the tab key.
Default checked field.

Drop Down Menu

Can be used to allow users to select one option or multiple options.

Sample
Favortie Color:
CODE

Attributes

name

size
multiple
selected
value
Gives the field a name so the program that handles the form can identify the fields.
Number of visible items at a time.
Allows multiple choices if set to yes.
Default selected item.
Value to send if selected.

Sumbit Button

Allows users to submit the form.

Sample
CODE

Attributes

name

value
align


tabindex

Gives the field a name so the program that handles the form can identify the fields.
What will be written on the button.
Defines how the button is aligned. TOP, MIDDLE, BOTTOM, RIGHT, LEFT, TEXTTOP, BASELINE, ABSMIDDLE, ABSBOTTOM.
Defines the order of how different fields should be activated when the visitor clicks the tab key.

Reset Button

Allows users to reset the form.

Sample
CODE

Attributes

name

value
align


tabindex

Gives the field a name so the program that handles the form can identify the fields.
What will be written on the button.
Defines how the button is aligned. TOP, MIDDLE, BOTTOM, RIGHT, LEFT, TEXTTOP, BASELINE, ABSMIDDLE, ABSBOTTOM.
Defines the order of how different fields should be activated when the visitor clicks the tab key.