Notice: Undefined index: ORIG_PATH_INFO.
1   IN FILE   "/home/webdevinfo/public_html/include/Url.class.php"   ON LINE   61
2   IN FILE   "/home/webdevinfo/public_html/include/ConfigPublic.inc.php"   ON LINE   13
3   IN FILE   "/home/webdevinfo/public_html/article.php"   ON LINE   3

Forms - Part II - Advanced Forms
Home Login Registration Authors Contact Us About Us Subscribe
Want to receive new articles via e-mail? Click here!
: Home  :: Web Design  :: Design Tuturial
Forms - Part II - Advanced Forms
by Webdevinfo - Webmaster
Views: 544
Votes: none
Rating: 0.00
Synopsis:
In part one of this series, we went over Text boxes, Hidden, Password and the Checkbox Form Element Properties. We will now continue with the remaining properties.
Rate this article  Print this article  Email this article  View this article in PDF  Discuss this article
Page:  1 | 2 |  Next >  Last
The Article

Radio, Submit, Image Submit & Reset Buttons

In part one of this series, we went over Text boxes, Hidden, Password and the Checkbox Form Element Properties. We will now continue with the remaining properties.


* RADIO BUTTON

<INPUT type="radio">

Enables the user to select multiple options.

<FORM METHOD=post ACTION="/cgi-bin/example.cgi">
<INPUT type="RADIO" name="selection1"> Selection 1
<INPUT type="RADIO" name="selection2"> Selection 2
<INPUT type="RADIO" name="selection3"> Selection 3
<INPUT type="Submit" value="Submit">
</FORM>

Radio Button Attributes:

TYPE - Radio
CHECKED - Specifies a default selection.
NAME - Name of the variable to be processed by the form processing script.
VALUE - The value of the selected radio button.


* SUBMIT

<INPUT type="submit">

Enables users to submit the form information to the form processing script.

<INPUT type="SUBMIT" value="Submit">

Submit Attributes:

TYPE - Submit
NAME - Name of the variable to be processed by the form processing script.
VALUE - Specifies the text to be displayed on the submit button.


* IMAGE SUBMIT BUTTON

<INPUT type="image" SRC="url">

Enables users to submit the form information to the form processing script. Instead of the regular submit button, an image submit button will be displayed.

<INPUT type="image" name="submit" SRC="image.gif">

Image Submit Attributes:

TYPE - Image
NAME - Name of the variable to be processed by the form processing script.
SRC - Image URL.


* RESET

<INPUT type="reset">

Enables users to clear a form if necessary.

<INPUT type="RESET" value="Reset">

Reset Submit Attributes:

TYPE - Reset
VALUE - Specifies the text to be displayed on the reset button.

Select, Option & Textarea

* SELECT

<select></select>

Surrounds the code for a selection drop down menu.

<FORM METHOD=post ACTION="/cgi-bin/example.cgi">
<SELECT SIZE="5">
<OPTION>option 1
<OPTION>option 2
<OPTION>option 3
</SELECT>
<INPUT type="Submit" value="Submit">
</FORM>

Select Attributes:

NAME - Name of the variable to be processed by the form processing script.
SIZE - Specifies the number of visible selections.
MULTIPLE - Enables users to select multiple selections.


* OPTION

<option>

Used with the SELECT element to display the
options.

<FORM METHOD=post ACTION="/cgi-bin/example.cgi">
<SELECT>
<OPTION>option 1
<OPTION>option 2
<OPTION>option 3
</SELECT>
<INPUT type="Submit" VALUE="Submit">
</FORM>

Option Attributes:

SELECTED - Specifies a default selection.
VALUE - Specifies the value of the variable in the select element.


* TEXTAREA

<textarea></textarea>

Specifies an open text area.

<FORM METHOD=post ACTION="/cgi-bin/example.cgi">
Enter Your Comments:<BR>
<TEXTAREA wrap="virtual" name="Comments" rows=3
cols=20 maxlength=100>
</TEXTAREA><BR>
<INPUT type="Submit" VALUE="Submit">
<INPUT type="Reset" VALUE="Clear">
</FORM>

Textarea Attributes:

NAME - Name of the variable to be processed by the form processing script.
COLS - The number of columns within the text area.
ROWS - The number of rows within the text area.
WRAP - Specifies the text wrap. The default setting is off.
The WRAP can be set to "VIRTUAL" or "PHYSICAL" and will wrap the text as the user types.

Tip: In order to properly format your form, you may want to place it within a table.

Here is a basic email form set up within a table:

<FORM action="mailto:you@yourdomain.com">
<TABLE BORDER="0" CELLPADDING="2">
<TR>
<TD><FONT face="Verdana" size=2>Name:</FONT></TD>
<TD><INPUT name="Name" value="" size="10"></TD>
</TR>
<TR>
<TD><FONT face="Verdana" size=2>Email:</FONT></TD>
<TD><INPUT name="Email" value="" size="10"></TD>
</TR>
<TR>
<TD></TD>
<TD><INPUT type="submit" value="Submit"></TD>
</TR>
</TABLE>
</FORM>

Page:  1 | 2 |  Next >  Last
Rate this article  Print this article  Email this article  View this article in PDF  Discuss this article
Similar/related articles:
Advanced Search
Site Search:


FirstWebHosting
Top Ten Hosts as picked by our editors - with reviews and interviews.
The Host Planet
Web hosting reviews and ratings. Learn how to spot a great host.
Hosts2002
The first and greatest hosting directory with the consumer in mind.
Hostcue.com
Hosting directory for the masses with special offers Check us out!
WebDevForums
Web developers or all levels discuss the details of design and ecommerce.
Needscripts.com
Free scripts and applications for web developers.