<form action=...
method=...
enctype=....
onSubmit=....
:
:
</form>
|
Basic Form Structure
These are the basic tags for
creating a web page form. The value of
action should be a valid URL to server-side
CGI program for processing the form;
method is either "post" or "get" depending
on how the server-side CGI is written; enctype can have a value of "text/plain" to
try to send form data by email; onSubmit is optional tag used to run a
JavaScript function before the server is contacted.
Some forms can be operable without a value for
action if they use JavaScript rather than
CGI. |
<input type="text"
name="...."
size="X"
maxlength="Y"
value="..."> |
Single Line Text Input
Form element for entering
text. Value of
name identifies
the contents to the CGI;
size
is optional for the width of the field in characters; maxlength is optional to limit the length of
input in characters; value is
optional text string to be displayed when the form first loads. |
<input type="password"
name="...."
size="X"
maxlength="Y"
value="..."> |
Password Input
Similar to the single line test
input except all letter entered are disguised. |
<textarea name="..."
rows="X" cols="Y"
wrap="virtual">
...</textarea> |
Text Area Inputs
Multi-line text input field.
Value of
name identifies the
contents to the CGI; rows is
the number of lines for the size of the box and
cols is the width of the box in characters;
wrap is optional to indicate
input text should be wrapped if value is "virtual"; and any text before
the closing </textarea>
is displayed in the form field when the page loads. |
<input type="radio"
name="..."
value="..." checked>
<input type="radio"
name="..."
value="...">
|
Radio Buttons
Sets of buttons where only one
button within the set can be selected at a time. A set of buttons is
defined by having the same value for
name; the contents of
value are what is sent when the form data is
transmitted to a CGI program; an optional
checked inside a tag indicates which radio
button in the set is initially selected when the page loads. |
<input type="checkbox"
name="..."
value="..." checked>
<input type="checkbox"
name="..."
value="..." checked>
|
Check Box
Sets of items where more than one (or
none) may be selected at a time. Value of
name identifies the contents to the CGI; the
contents of value are what is
sent when the form data is transmitted to a CGI program; optional
checked inside a tag indicates
that the box is initially selected when the page loads. |
<select name="...">
<option value="..."> XXXXX</option>
<option value="..." selected> YYYYY</option>
<option value="..."> ZZZZZ</option>
</select></pre> |
Menu Select
Creates a drop down menu. Value of
name identifies the contents to
the CGI; contents of value are
what is sent when the form data is transmitted to a CGI program (if there
are no value paramaters, the
form will send the text string of the menu item); XXXXX, YYYYY, ZZZZZ are the items that
appear in the menu; selected
indicates which menu item is displayed when the page loads. |
<input type="submit"
value="..."> |
Submit button
Tells the browser to send the form
data to the CGI. The contents of
value appear as the label for the button in
the web page. |
<input type="reset"
value="...">
|
Reset Button
Tells the web browser to restore all
form elements to their initial state. The contents of
value appear as the label for the button in
the web page. |
<input type="hidden"
name="..."
value="..."> |
Hidden Form Element
Value of
name identifies the contents to the CGI;
contents of value is what is
sent to the CGi program. |
