HTML5 brings us new form attributes that you can use reduce the dependency of JavaScript to manage your input form elements. For example, some of the new attributes allow you to set a minimum or maximum value for an input element, or set a maximum length which can limit the input of a string value. As HTML5 is being developed, one of the considerations has been making forms on the web easier to use with built-in features without the need for extra JavaScript. The new HTML5 form attributes, as of this writing, is not supported by all of the major browsers. Chrome, Opera, Firefox, and Safari have the most support. Each item below is tested for support in the current browser. In the items below, green indicates that your current browser should support the attribute while red indicates that it does not. Please note that the HTML5 specification is still being developed, so this information can change. On the right side of this text, you will notice that this page has detected your browser version.

Form Attributes	Description
autocomplete	Specifies is a field should enable the autocomplete feature.
autofocus	Focuses the input on the element when the page is loaded.
form	Specifies one or more forms to which the input element belongs.
formaction	Overrides the action attribute on the form element.
formenctype	Overides the enctype attribute on the form element.
formmethod	Overrides the method attribute on the form element.
formnovalidate	Overrides the novalidate attribute on the form element.
formtarget	Overrides the target attribute on the form element.
heigth	Sets the height of an input element of type "image".
list	The list attribute refers to a datalist element that contains pre-defined options for an input element.
max	The max attribute specify the maximum value for an input element.
maxlength	The maxlength attribute limits the number of characters that an input or textarea can accept.
multiple	Allows file inputs to accept more than one file for upload.
min	The min attribute specify the minimum value for an input element.
novalidate	Disables the form submission validation when specified on a form element.
pattern	Validates the value of an element value against a regular expression.
placeholder	Gives the user a hint about what type of data they should enter.
required	A boolean attribute that means the element is required.
step	Value specified that increments the value for an input with the type equal to "number".
width	Sets the width of an input element of type "image"

Autocomplete

The autocomplete attribute specifies whether a form or input field should have autocomplete on or off. If the autocomplete attribute is set to "on", the browser automatically complete values based on values that the user has entered before. You may need to activate the autocomplete function in your browser for this attribute to work properly.

<form action="form.htm" autocomplete="on">
  First name:<input type="text" name="fname">
  Last name: <input type="text" name="lname">
  E-mail: <input type="email" name="email" autocomplete="off">
  <input type="submit">
</form>

Autofocus

The autofocus attribute is a boolean attribute. When present, it specifies that an <input> element should get focus when the page loads.

Name: <input type="text" name="fullName" autofocus>

Form

The form attribute specifies one or more forms an <input> element belongs to. For an input element to belong to more than one form, use a space-separated list of form ids.

<form id="form1" action="form.htm">
  First name:<input type="text" name="fname">
  <input type="submit" value="submit">
</form>
Last name: <input type="text" form="form1" name="lname">

Formaction

The formaction attribute specifies the URL of a file that will process the input control when the form is submitted. This attribute overrides the action attribute of the <form> element.

<action="form.htm">
  First name:<input type="text" name="fname">
  <input type="submit" value="Here">
  <input type="submit" value="There" formaction="/">
</form>

Formenctype

The formenctype attribute specifies how the form data should be encoded when submitting it to the server, when the form method is "post".

<action="form.htm" method="post">
  First name:<input type="text" name="fname">
  <input type="submit" value="Submit">
  <input type="submit" value="Multipart" formenctype="multipart/form-data">
</form>

Formmethod

The formmethod attribute defines the HTTP method for sending form data to the action URL.

<action="form.htm" method="get">
  First name:<input type="text" name="fname">
  <input type="submit" value="Get">
  <input type="submit" value="Post" formmethod="post">
</form>

Formnovalidate

The novalidate attribute is a boolean attribute. When specified, it instructs the browser that the <input> element should not be validated when submitted.

<action="form.htm">
  Email:<input type="email" name="userEmail">
  <input type="submit" value="Submit">
  <input type="submit" value="No Validate" formnovalidate>
</form>

Formtarget

The formtarget attribute indicates where to display the response after submitting the form.

<action="form.htm">
  Name:<input type="text" name="name">
  <input type="submit" value="Submit">
  <input type="submit" value="New Window" formtarget="_blank">
</form>

Height and Width

The height and width attributes specify the height and width of an <input> element with the type = "image".

<action="form.htm">
  Name:<input type="text" name="name">
  <input type="image" src="submit.gif" alt="Submit" width="32" height="32">
</form>

List

The list attribute refers to a datalist element that contains pre-defined options for an input element.

Select a Browser: <input list="browsers" />
<datalist id="myDatalist">
  <option value="Internet Explorer"/>
  <option value="Firefox"/>
  <option value="Chrome"/>
  <option value="Opera"/>
  <option value="Safari"/>
</datalist>

Min and Max

The min and max attributes specify the minimum and maximum value for an input element.

Qty (5-10):<input type="number" min="5" max="10" name="qty">
  <input type="submit">
</form>

Maxlength

The maxlength attribute limits the number of characters that an input or textarea can accept.

Code:<input type="text" maxlength="10" name="code">
  <input type="submit">
</form>

Multiple

The multiple attribute is a boolean attribute. If specified, the user is allowed to enter more than one value in the <input> element.

Select Files: <input type="file" multiple>
</form>

Novalidate

The novalidate attribute is a boolean attribute. If specified, the form data should not be validated when submitted.

<action="form.htm" novalidate>
  Email:<input type="email" name="userEmail">
  <input type="submit" value="Submit">
</form>

Pattern

The pattern attribute specifies a regular expression that the <input> element's value is checked against.

Pin:<input type="text" name="pinNum" pattern="[0-9]{4}">

Placeholder

The placeholder attribute specifies a hint that describes the expected value of an input field. The hint is displayed in the input field when it is empty, and disappears when the field gets focus.

Name:<input type="text" name="fullName" placeholder="Enter your Full Name">

Required

The required attribute is a boolean attribute. If specified, an input field must be filled out before submitting the form.

UserName:<input type="text" name="username" required>

Step

The step attribute specifies the number interval for an <input> element.

Points:<input type="number" step="2">

• Privacy
• Support
• Archive