HTML <form> Element

The <form> element creates an interactive form for collecting information from users. It can contain controls such as text fields, checkboxes, radio buttons, select menus, text areas, and buttons, and can submit the entered information to a server for processing.

Syntax

<form action="/submit-form" method="post">
  <label for="name">Name:</label>
  <input type="text" id="name" name="name">
  <button type="submit">Submit</button>
</form>

The <form> element contains the controls used to collect information. The action attribute specifies where the submitted data is sent, while the method attribute specifies the HTTP method used for the submission.

Attributes

The <form> element supports the global HTML attributes and the following element-specific attributes:

Attribute	Description
`accept-charset`	Specifies the character encoding used when submitting the form.
`action`	Specifies the URL that processes the submitted form data.
`autocomplete`	Controls whether the browser may automatically complete form controls using previously entered information.
`enctype`	Specifies how form data is encoded when it is submitted using the `post` method.
`method`	Specifies the HTTP method used when submitting the form.
`name`	Assigns a name to the form that can be used when referring to it from scripts or document collections.
`novalidate`	Indicates that the browser should not perform built-in form validation when the form is submitted.
`rel`	Describes the relationship between the current document and the destination of the form submission.
`target`	Specifies where the response received after submitting the form should be displayed.

Example

The following example creates a simple contact form with fields for a name, email address, and message. Submitting the demonstration form does not send the information to a server:

Play in Editor

Usage Notes

The <form> element acts as a container for controls that collect information from users. Common form controls include <input>, <textarea>, <select>, and <button>.

Controls that need to send values with the form generally require a name attribute. The name becomes the identifier associated with the control's submitted value.

The get method normally places submitted form data in the URL and is useful for requests such as searches where the resulting URL can be bookmarked or shared. The post method sends the form data in the request body and is commonly used when submitting information that changes data or should not appear in the URL.

The enctype="multipart/form-data" value is required when a form using the post method needs to upload files.

HTML forms cannot be nested inside other <form> elements. Close one form before beginning another.

Browser-side validation can help users correct common mistakes before submission, but server-side validation is still necessary because client-side validation alone cannot be relied upon to verify submitted data.

Accessibility

Every form control should have a clear purpose that users can understand. In most cases, associate a visible <label> with its control using matching for and id values.

Related controls such as groups of radio buttons or checkboxes can be grouped with <fieldset> and described with <legend> so their relationship is clear to users of assistive technologies.

Provide understandable instructions and validation messages when input has special requirements. Error messages should identify the affected field and explain what the user needs to correct.

Do not rely on placeholder text as the only label for a form control. Placeholder text can disappear when users begin typing and may not provide a reliable accessible name.

Browser Support

Baseline: Widely available indicates a feature has been supported by core browsers for at least 30 months. At this stage, the feature is considered stable and safe for most websites to use without needing to worry about compatibility issues or fallbacks, as it is supported by the vast majority of users' devices and browser versions.

For detailed browser compatibility information, see Can I Use: HTML <form> Element .

<input> - Creates many types of form controls for entering or selecting values.

<label> - Provides a descriptive label for a form control.

<button> - Creates a clickable button that can submit, reset, or interact with a form.

<select> - Creates a control for choosing from a list of options.

<textarea> - Creates a multiline text-entry control.

<fieldset> - Groups related form controls and labels.

Specifications

HTML Living Standard: The <form> Element

HTML <form> Element