HTML - <form>
The HTML <form>
element represents a document section that contains interactive controls to submit information to a web server.
Example
HTML Content
<!-- Simple form which will send a GET request --> <form action=""> <label for="GET-name">Name:</label> <input id="GET-name" type="text"> <input type="submit" value="Save"> </form> <!-- Simple form which will send a POST request --> <form action="" method="post"> <label for="POST-name">Name:</label> <input id="POST-name" type="text"> <input type="submit" value="Save"> </form> <!-- Form with fieldset, legend, and label --> <form action="" method="post"> <fieldset> <legend>Title</legend> <input type="radio" id="radio"> <label for="radio">Click me</label> </fieldset> </form>
Description
The HTML <form>
element represents a document section that contains interactive controls to submit information to a web server.
It is possible to use the :valid
and :invalid
CSS pseudo-classes to style a <form>
element.
Content categories | Flow content, palpable content |
---|---|
Permitted content | Flow content, but not containing <form> elements |
Tag omission | None, both the starting and ending tag are mandatory. |
Permitted parent elements | Any element that accepts flow content |
DOM interface | HTMLFormElement |
Attributes
Includes the Global Attributes.
Name | Version | Description |
---|---|---|
accept |
HTML 4 | A comma-separated list of content types that the server accepts. |
accept-charset |
A space- or comma-delimited list of character encodings that the server accepts. The browser uses them in the order in which they are listed. The default value, the reserved string "UNKNOWN" , indicates the same encoding as that of the document containing the form element.In previous versions of HTML, the different character encodings could be delimited by spaces or commas. In HTML5, only spaces are allowed as delimiters. |
|
action |
The URI of a program that processes the form information. This value can be overridden by a formaction attribute on a <button> or <input> element. |
|
autocapitalize |
This is a nonstandard attribute used by iOS Safari Mobile which controls whether and how the text value for textual form control descendants should be automatically capitalized as it is entered/edited by the user. If the autocapitalize attribute is specified on an individual form control descendant, it trumps the form-wide autocapitalize setting. The non-deprecated values are available in iOS 5 and later. The default value is sentences . Possible values are:
|
|
autocomplete |
HTML5 | Indicates whether input elements can by default have their values automatically completed by the browser. This setting can be overridden by an autocomplete attribute on an element belonging to the form. Possible values are:
Note: If you set |
enctype |
When the value of the method attribute is post , enctype is the MIME type of content that is used to submit the form to the server. Possible values are:
This value can be overridden by a |
|
method |
The HTTP method that the browser uses to submit the form. Possible values are:
This value can be overridden by a |
|
name |
The name of the form. In HTML 4, its use is deprecated (id should be used instead). It must be unique among the forms in a document and not just an empty string in HTML 5. |
|
novalidate |
HTML5 | This Boolean attribute indicates that the form is not to be validated when submitted. If this attribute is not specified (and therefore the form is validated), this default setting can be overridden by a formnovalidate attribute on a <button> or <input> element belonging to the form. |
target |
A name or keyword indicating where to display the response that is received after submitting the form. In HTML 4, this is the name/keyword for a frame. In HTML5, it is a name/keyword for a browsing context (for example, tab, window, or inline frame). The following keywords have special meanings:
HTML5: This value can be overridden by a |
Browser Compatibility
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Basic support | 1.0[1] | 1.0 (1.7 or earlier) | (Yes) | (Yes) | (Yes) |
novalidate attribute |
1.0 | 4.0 (2.0) | 10 | ? | ? |
Feature | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Basic support | (Yes) | 1.0 (1.0) | (Yes) | (Yes) | (Yes) |
novalidate attribute |
? | 4.0 (2.0) | (Yes) | ? | ? |
[1] The Google Chrome UI for auto-complete request varies, depending on whether autocomplete
is set to off
on input
elements as well as their form. Specifically, when a form has autocomplete
set to off
and its input element's autocomplete
field is not set, then if the user asks for autofill suggestions for the input element, Chrome might display a message saying "autocomplete has been disabled for this form." On the other hand, if both the form and the input element have autocomplete
set to off
, the browser will not display that message. For this reason, you should set autocomplete
to off
for each input that has custom auto-completion.
See Also
- HTML forms guide
- Other elements that are used for creating forms:
<button>
,<datalist>
,<fieldset>
,<input>
,<keygen>
,<label>
,<legend>
,<meter>
,<optgroup>
,<option>
,<output>
,<progress>
,<select>
,<textarea>
.
Specifications
Specification | Status | Comment |
---|---|---|
WHATWG HTML Living Standard The definition of '<form>' in that specification. |
Living Standard | |
HTML5 The definition of '<form>' in that specification. |
Recommendation | |
HTML 4.01 Specification The definition of '<form>' in that specification. |
Recommendation | Initial definition |
License
© 2016 Mozilla Contributors
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-us/docs/web/html/element/form