HTML 5 <form> tag
Definition and Usage
The form element creates a form for user input. A form can contain
textfields, checkboxes, radio-buttons and more. Forms are used to pass
user-data to a specified URL.
Differences Between HTML 4.01 and HTML 5
HTML 5 has some new attributes, and some HTML 4.01 attributes are no longer supported.
HTML 5 has a new attribute: replace. Which defines what to do after a for has
been submitted.
Example
| Source |
Output |
<form
action="form_action.asp"
method="get">
First name:
<input type="text" name="fname" value="Mickey"
/>
<br />
Last name:
<input type="text" name="lname" value="Mouse"
/>
<br />
<input type="submit" value="Submit" />
</form>
<p>
If you click the "Submit" button, you will send your input to a new page
called form_action.asp.
</p> |
If you click the "Submit" button, you will send your input to a new page called
form_action.asp.
|
Attributes
- 4: indicates if the attribute is defined in HTML 4.01
- 5: indicates if the attribute is defined in HTML 5
| Attribute |
Value |
Description |
4 |
5 |
| action |
URL |
A URL that defines where to send the data when the submit button
is pushed |
4 |
5 |
| data |
URL |
For inserting data automatically |
|
5 |
| replace |
value |
Defines what to to when a form has been submitted |
|
5 |
| accept |
list of contenttypes |
A comma separated list of content types that the server
that processes this form will handle correctly |
4 |
5 |
| accept-charset |
charset_list |
A comma separated list of possible character sets for the
form data. The default value is
"unknown" |
4 |
5 |
| enctype |
mimetype |
The mime type used to encode the content of the form |
4 |
5 |
| method |
get
post |
The HTTP method for sending data to the action URL. Default
is get. method="get": This method sends the form contents
in the URL: URL?name=value&name=value. Note: If the form values contains non-ASCII characters or
exceeds 100
characters you MUST use method="post".
method="post": This method sends the form contents in the body of the request.
Note: Most browsers are
unable to bookmark post requests.
|
4 |
5 |
| name |
form_name |
Defines a unique name for the form. Not supported, use id instead |
4 |
|
| target |
_blank
_self
_parent
_top |
Where to open the target URL.
- _blank - the target URL will open in a new window
- _self - the target URL will open in the same frame as it was clicked
- _parent - the target URL will open in the parent frameset
- _top - the target URL will open in the full body of the window
|
4 |
5 |
Standard Attributes
| class, contenteditable, contextmenu, dir, draggable, id,
irrelevant, lang, ref, registrationmark, tabindex, template, title |
For a full description, go to Standard
Attributes in HTML 5.
Event Attributes
| onabort, onbeforeunload, onblur, onchange, onclick,
oncontextmenu, ondblclick, ondrag, ondragend, ondragenter, ondragleave,
ondragover, ondragstart, ondrop, onerror, onfocus, onkeydown, onkeypress,
onkeyup, onload, onmessage, onmousedown, onmousemove,
onmouseover, onmouseout, onmouseup, onmousewheel, onresize, onscroll, onselect,
onsubmit, onunload |
For a full description, go to Event Attributes
in HTML 5.
Try-It-Yourself Demos
Form with
input fields and a submit button
How to add a form to a page. The form contains two input fields and a submit
button.
Form with
checkboxes
This form contains two checkboxes, and a submit button.
Form with
radiobuttons
This form contains two radio buttons, and a submit button.
Send e-mail
from a form
How to send e-mail from a form.
|
