4.0 HTML, Form Tags and Properties
<Form>...</Form> ACTION=`URL` \| ENCTYPE=`Text` METHOD=`Option` \| ( POST \| GET ) \| TARGET=`Text` This tag marks the beginning and the end of a Web page form. The ACTION property specifies to the server the URL to which the contents of the form are to be sent.The URL usually point to a CGI script to process the form. The METHOD property specifies how information is transferred to the Web server, the two available methods are POST and GET. The POST method instructs the server to process the form line by line, whereas the GET method instructs the server to process the entire form at once. The ENCTYPE property specifies the encoding type used to submit the data to the server, and the TARGET property specifies the frame of window that displays the form's results.
HTML Example <FORM METHOD="POST" ACTION="URL"> Form input tags and other HTML tags </FORM>	Browser Output N/A
Previous Section Table Of Contents Next Section

<INPUT>...</INPUT>

CHECKED | LOOP= Value | LOWSRC=Document | MAXLENGTH=Value

NAME=Text | SIZE=Value | SRC=Document

START=Option | ( FILEOPEN | MOUSEOVER )

USEMAP= #Map_Name | VALUE= Value

VSPACE= Value | WIDTH=Value

This tag creats the input object that is used in a Web page form. Many different properties can be used with the INPUT tag depending on the TYPE of the INPUT object. In the following HTML examples many of these properties will be used, as different input types are presented. The different INPUT TYPES are:

CHECKBOX : Creates a checkbox that allows the user to select or deselect options on a form.

HIDDEN : Creates a hidden object

IMAGE : Creates an image object

PASSWORD : Creates a text box which hides the user's enteries replacing them with asterisks * , But still, the user can see the actual text by viwing the HTML source of the document.

RADIO : Creates a radio button that allows the user to select an option from many options. All radio buttons within the same group have the same name.

RESET : Creates a button that either clears the form's fields, or return their default values when pressed

SUBMIT : Creates a button that submits the form to the server for processing, when pressed.

TEXT : Creates a text box that allows the input of a single word or line of text. The default width of a text box is 20 characters. If more than one text box exist on a form, each one must be given a distinct name.

HTML Example

<FORM METHOD=POST ACTION=URL >

<INPUT TYPE="CHECKBOX" NAME="BOXA">A

B<INPUT TYPE="CHECKBOX" NAME="BOXB">

<INPUT TYPE="CHECKBOX" NAME="BOXC" CHECKED>C

</FORM>

Browser Output

HTML Example

<FORM METHOD=POST ACTION=URL >

<INPUT TYPE="HIDDEN" NAME="EMAIL" VALUE="mjaneb@kwantlen.com">

</FORM>

Browser Output

HTML Example

<FORM METHOD=POST ACTION=URL >

<INPUT TYPE="IMAGE" SRC="URL" NAME="Text" VALUE="Text">

</FORM>

Browser Output

N/A

HTML Example

<FORM METHOD=POST ACTION=URL >

PASSWORD<INPUT TYPE="PASSWORD" NAME="PASSWORD" MAXLENGTH=25 SIZE=20>

</FORM>

Browser Output

HTML Example

<FORM METHOD=POST ACTION=URL >

Choose age group :

<INPUT TYPE="RADIO" NAME="Age" VALUE"firstgroup">0 - 18

<INPUT TYPE="RADIO" NAME="Age" VALUE"secondgroup" CHECKED>18 - 40

<INPUT TYPE="RADIO" NAME="Age" VALUE"thirdgroup" >40 - 60

</FORM>

Browser Output

HTML Example

<FORM METHOD=POST ACTION=URL >

<INPUT TYPE="RESET" >

<INPUT TYPE="RESET" VALUE="RESET FORM NOW" >

</FORM>

Browser Output

HTML Example

<FORM METHOD=POST ACTION=URL >

<INPUT TYPE="SUBMIT" >

<INPUT TYPE="SUBMIT" VALUE="SUBMIT FORM " >

</FORM>

Browser Output

HTML Example

<FORM METHOD=POST ACTION=URL >

<INPUT TYPE="TEXT" SIZE="10" >

<INPUT TYPE="TEXT" MAXLENGTH="10" VALUE="DD/MM/YY" >

</FORM>

Browser Output

      Previous Section           Table Of Contents            Next Section

<SELECT>...</SECLECT>

MULTIPLE | NAME=Text | SIZE=Value

<OPTION>...</OPTION>

SELECTED | VALUE=Value

The <SELECT> tag is used to create a selection list. The selection list is constructed using The <OPTION> tag . The VALUE property can be used to customize a menu of options, it specifies the value of the option to be sent to the server. The SELECTED property points to the default or selected option in the selection list. The MULTIPLE property is used within the <SELECT> tag to allows the user to select multiple options from the list. The SIZE property is also used within the <SELECT> tag to specify the number of lines or options to display in a scroll box, if the number of options is more than the number of lines in the list box, the list box will have a scroll bar.

HTML Example

Languages you speak :

<FORM METHOD="POST" ACTION="URL">

<SELECT SIZE=3 NAME="Languages you speak">

<OPTION VALUE="Eng"> English

<OPTION> French

<OPTION> Spanish

<OPTION> Chinese

</SELECT>

Browser Output

Languages you speak :

HTML Example

Languages you speak :

<FORM METHOD="POST" ACTION="URL">

<SELECT SIZE=5 MULTIPLE NAME="Languages you speak">

<OPTION VALUE="Eng"> English

<OPTION SELECTED> French

<OPTION> Spanish

<OPTION> Chinese

</SELECT>

Browser Output

Languages you speak :

      Previous Section           Table Of Contents            Next Section

<TEXTAREA>...</TEXTAREA>

COLS=Value | NAME=Text

ROWS=Value | WRAP=Option | ( OFF | VIRTUAL | PHYSICAL )

This tag create a text box that allows multiple line text entry. ROWS, COLS, NAME, and WRAP are all properties used within this tag for text box customization.

HTML Example

<FORM METHOD=POST ACTION=URL >

<TEXTAREA NAME="COMMENTS" ROWS=5 COLS=30>

We welcome your comments

</TEXTAREA>

</FORM>

Browser Output

We welcome your comments

HTML Example

<FORM METHOD=POST ACTION=URL >

<TEXTAREA NAME="COMMENTS" ROWS=10 COLS=30 WRAP=OFF>

We welcome your comments

</TEXTAREA>

</FORM>

Browser Output

      Previous Section           Table Of Contents            Next Section