A form used in HTML is used to send information to a destination. HTML
is used to create the forms but to perform the action that will be taken
requires other program languages like java, C or perl. You can place
several forms within one HTML page but you cannot nest your forms. Below
you will find each of the tags and attributes that can be placed within a
form.
<FORM> </FORM> You form but begin with the <FORM> tag and end
with the </FORM> tag. There are 3 attributes that are used with the <FORM>
tag, they are ACTION, METHOD and ENCTYPE.
ACTION Attribute instructs the browser where it should send the
data collected on the form. You can tell the browser to just send the data
to your email or you can us a program to send your data. You would need
some knowledge in programming in the other language to use them for your
data.
METHOD Attribute explains how the information will be sent, either POST
or GET.
ENCTYPE Attribute will determine the format the information will be
sent. You get three choices applications/x-www-form-urlencoded (default),
multipart/formdata and text/plain.
applications/x-www-form-urlencoded - this will send the data converting
the spaces to the "&" sign and non-alphanumeric characters to the "%"
sign. It will also be mailed as an attachment.
multipart/formdata - this value should be used when the form is set up
to accept files. I don't suggest using this as we all know files can
contain viruses.
text/plain - this will send the form data in plain text displaying each
field of the form on a separate line.
Form Fields
<INPUT> This tag is used to specify the kind of field that will be
placed on the form. The fields used are buttons, check boxes, images,
one-line text fields, passwords and radio buttons. Then there are
attributes that can be used for with the <INPUT> tag.
Attributes
ALIGN - alignment can be set to left, right, center and justify
CHECKED - Default check this field
COLS - set the width of a text area
MAXLENGTH - set the maximum number of characters allowed in a text field
NAME - sets the name of the field
ROWS - sets the amount of rows allowed in the text area
SIZE - sets the size of the field in characters
VALUE - sets the default value to be displayed on the form when viewed
SRC - used with the IMAGE input to specify the url to use for the image
TYPE - specifies the type of field being used
BUTTON FIELD is used with scripts like JavaScript. Although the
button will look similar to the Reset and Submit buttons it does not
work the same way.
<INPUT TYPE="button" NAME="ADD" VALUE="ADD">
CHECK BOX provides the user with selectable boxes. The tag used
is <INPUT TYPE="CHECKBOX"> By using the
CHECKED attribute it sets the default box to be chosen. When using the
CHECK BOX Field you are enabling the user to check off more than one
choice.
<FORM>
<INPUT TYPE="CHECKBOX" NAME="1" CHECKED>
ONE
<INPUT TYPE="CHECKBOX" NAME="2" CHECKED> TWO
<INPUT TYPE="CHECKBOX" NAME="3"> THREE
</FORM>
SELECTION FIELDS The Selection field allows for a number of
options to choose from. This field will require the use of the <SELECT>
tag and the <OPTION> tag.
The Selection field using just one default selection. If the user was to
select a different number the defaulted selection would not be submitted.
<SELECT NAME="Amount">
<OPTION> One
<OPTION> Two
<OPTION SELECTED> Three
<OPTION> Four
</SELECT
The Selection field using more than one selection using the
MULTIPLE attribute. The multiple attribute allows the user filling out
the form to choose from 0-all of the options in the list.
<SELECT NAME"Amount" MULTIPLE>
<OPTION SELECTED> One
<OPTION> Two
<OPTION SELECTED> Three
<OPTION> Four
</SELECT>
HIDDEN These fields are much like the text fields only they are not
seen by the user filling out the form. It is used to submit information
that has not been entered by the person filling in the form. The Hidden
tag will look like <INPUT TYPE="Hidden"> and use the Name attribute and
the Value attribute. What the line below will do is add a subject line to
the data being sent. The person filling out the form will never see this
but the recipient of the form will have this field added to their
information received along with the senders own data that was entered.
PASSWORD FIELD will work like a text field only you cannot see the
text that you type. The tag used is <INPUT TYPE="PASSWORD">
<FORM>
<INPUT TYPE="PASSWORD" NAME="Password"
SIZE=20>
</FORM>
RADIO BUTTON is similar to the CHECK BOX as it provides one a
selection to choose from. The tag used is <INPUT TYPE="RADIO"> It will use
the CHECKED attribute to specify the default choice. The RADIO BUTTON does
not allow more than one choice. If the Radio Buttons are not all
named the same they will not work properly, therefore setting a value for
them will allow you to distinguish which button has been chosen.
<FORM>
<INPUT TYPE="RADIO" NAME="choose" VALUE="One"> One
<INPUT TYPE="RADIO" NAME="choose" VALUE="Two" CHECKED> Two
<INPUT TYPE="RADIO" NAME="choose" VALUE="Three"> Three
</FORM>
RESET & SUBMIT BUTTONS are used to either reset the form, deleting any
data that has been entered or to submit the form, sending the data to the url specified in the ACTION attribute. Although the TYPE will either
be "RESET" or "SUBMIT" the VALUE attribute can be set to any desired text.
<FORM>
<INPUT TYPE="RESET" VALUE="Reset">
<INPUT TYPE="SUBMIT" VALUE="Submit">
<INPUT TYPE="RESET" VALUE="Clear Form">
<INPUT TYPE="RESET" VALUE="Send">
</FORM>
TEXT FIELD allows the field to have a single-line entry The tag
used is <INPUT TYPE="TEXT"> The attributes that can be used to control the
field are VALUE, SIZE and MAXLENGTH.
TEXT AREA allows you to create a field in which a large amount of
text can be entered. This field uses the <TEXTAREA> tag with the ROWS
and COLS attributes to determine the width and length of the text field.
<TEXTAREA ROWS="5" COLS="50" NAME="OPINION">
Enter your opinion in this area
</TEXTAREA>
Organizing Forms
By using the <FIELDSET> and the <LEGEND> tags you can organize parts of
your form. The <FIELDSET> tag groups data fields that you select into one
group, it creates a box around the fields you have specified to be
included in the group. The <FIELDSET> must begin with the <LEGEND> tag to
provide a title for the group.
