HTML forms are used to collect different types of user input.
Instance
-
Text fields
-
This example shows how to create a text field in an HTML page. The user can write text in the text field.
-
Password field
-
This example shows how to create an HTML password field.
(You can find more instances at the bottom of this page.) )
Form
A form is a region that contains form elements.
Form elements are elements that allow users to enter information in a table consignments (such as a text field, drop-down list, radio box, check box, and so on).
The form is defined using the form label (<form>).
<form> <input> <input></form>
Input
In most cases, the form label used is the input label (<input>). The input type is defined by the type attribute. Most of the input types that are often used are as follows:
Text fields
A text field is used when a user wants to type something like letters, numbers, and so on in a form.
<input type="text" name="firstname">
<input type="text" name="lastname">
</form>
The browser appears as follows:
Notice that the form itself is not visible. Also, in most browsers, the default width of a text field is 20 characters.
Radio button (Radio Buttons)
A radio box is used when a user chooses one of several given choices.
<form> <input type="radio" name="sex" value="male">
Male <input type="radio" name="sex" value="female">
female</form>
The browser appears as follows:
Note that you can only select one of these.
check box (checkboxes)
The check box is used when the user needs to select one or several options from several given selections.
<form> <input type="checkbox" name="bike">
I have a bike<br> <input type="checkbox" name="car">
i has a car</form>
The browser appears as follows:
Action Property (action) and confirmation button for the form
When the user clicks the Confirm button, the contents of the form are transferred to another file. The action properties of the form define the file name of the destination file. This file, which is defined by the action attribute, is usually processed in connection with the input data received.
action="html_form_action.asp" method="get">
Username: <input type= "text" name= "user" > <input type="submit" value="Submit">
</form>
The browser appears as follows:
If you type a few letters in the text box above and click the Confirm button, the input data will be transferred to the page named "Html_form_action.asp". That page will show the results of the input.
More examples
-
check box
-
This example shows how to create a check box in an HTML page. The user can select or deselect the check box.
-
radio button
-
This example shows how to create a radio button in HTML.
-
Simple drop-down list
-
This example shows how to create a simple drop-down list box in an HTML page. The drop-down list box is an optional list.
-
Another drop-down list
-
This example shows how to create a simple drop-down list with preselected values. (Translator Note: Preselected values refer to pre-specified preferences.) )
-
Text field (Textarea)
-
This example shows how to create a text field (multi-line text input control). The user can write text in the text field. There is no limit to the number of characters that can be written in a text field.
-
Create button
-
This example shows how to create a button. You can customize the text on the button.
-
FieldSet around data
-
This example shows how to draw a box with a caption around the data. Form instances
-
form with input box and confirmation button
-
This example shows how to add a form to a page. This form consists of two input boxes and a confirmation button.
-
A form with a check box
-
This form contains two check boxes and a confirmation button.
-
Form with radio button
-
This form consists of two radio boxes and a confirmation button.
-
Send e-mail from forms
-
This example shows how to send an e-mail message from a form.
Form Labels
label |
description |
tr>
<form> |
define forms for user input |
<input> |
define input fields |
tr>
<textarea> |
defines a text field (a multiline input control) |
<label> |
define a control label |
<fieldset> |
define field |
<legend> |
defines the title of the field |
<select> |
Define a selection list |
<optgroup> |
define option group |
<option> |
define options in the drop-down list |
<button> |
definition A button |
<isindex> |
is deprecated. Have <input> replace. |