Working with Forms in HTML
Working with Forms
The form element is a powerful part of HTML . Using forms you can get and recieve information from visitors. You may store that data into a file, place an order, gather user statistics, register the person to your web forum, or maybe subscribe them to your weekly newsletter.
A form is defined
with the <form> tag.
<form>
<input>
<input>
</form>
Input
Input tag is widely used in form. Input tag is commonly used with type attribute. Below are some examples of <Input> tag with type attribute.
Text Fields
Text Fields are most common used for collecting information such as names, email addresses, URLs, etc . For Example:
<form>
Name:
<input type="text" name="username"><br>
E-Mail:
<input type="text" name="email">
</form>
Name :
E-Mail:
Radio Buttons
Radio Buttons are used with user when you want the user to select one of the limited number of choices.. For Example:
<form>
<input type="radio" name="gender" value="Male">Male
<input type="radio" name="gender" value="Male">Female
</form>
Output:
Male Female
CheckBoxes
checkboxes are used when you want the user to select one or more option of a limited number of choices.
<form>
<input type="checkbox" name="course" value="Visual
Basic ">Visual Basic
<input type="checkbox" name="course" value="HTML">HTML
<input type="checkbox" name="course" value="Java">Java
</form>
Visual Basic HTML Java
Submit
Displays a send message button at the end of the form. Clicking this will send all the form data.
<form>
Name:
<input type="text" name="username">
<input type="submit" name="submit" value="Submit">
</form>
Name:
Button
Buttons are used to perform any action or send data..
<form>
Name:
<input type="text" name="username">
<input type="button" name="button" value="Button">
</form>
Name:
Reset
Reset type is used to clear all data in form.
<form>
Name:
<input type="text" name="username">
<input type="button" name="button" value="Button">
</form>
Name:
Text Area
The textarea is used for enter a message or comments.
<form>
<textarea cols=60 rows=8 name="message">
</textarea>
</form>
Select
Using <select> tag user can select one or more items from a menu or a scrolling list. They are similiar in functionality to radio buttons or checkboxes. Select menues are created with the <select> and <option> tags. <select> is the list itself and each <option> is an available choice for the user. For example:
<form>
<select name="course">
<option value="PHP">PHP</option>
<option value="ASP">ASP</option>
<option value="JavaScript">JavaScript</option>
<option value="HTML">HTML</option>
<option value="JSP">JSP</option>
</select>
</form>