HTML form Tag autocomplete Attribute Tutorial

In this section, we will learn what autocomplete attribute is and how to use it in HTML.

What is autocomplete Attribute in HTML <form> Tag?

When we click on an input element like a textbox in a form, browsers by default will show a set of values that the user had previously entered in other forms and so users can just pick one of these values in the list as the value of that input box. This is done to make the process faster for users.

But sometimes in a form we might want to turn off this capability of the browsers!

This is where we can use the autocomplete attribute in HTML <form>

There are two potential values for this attribute: “on” and “off”.

If the value of the attribute is set to “on” (the default value) that means use this capability of browsers for the input elements of the form. But if we set the value to “off” that means turn off the autocomplete capability of browsers for the target form.

HTML autocomplete Attribute in <form> Tag Syntax:

<form autocomplete = “on | off”> </form>

<form> Tag autocomplete Attribute Values

The values we could set for the autocomplete attribute are:

  • on: this value is set by default and it means the target form should implement the autocomplete capability of browsers.
  • off: use this value when you don’t want the browsers autocomplete property in your form.

Example: using autocomplete attribute in HTML <form> tag

See the Pen using autocomplete attribute in HTML <form> tag by Omid Dehghan (@odehghan) on CodePen.

In this example, the value of the autocomplete attribute is set to off and that means this particular form should not use the browser’s history to assist users when users are inserting values to input boxes. But if you set the value of the autocomplete attribute back to “on” then you’ll see browser’s history will appear when you click on the textbox input element.

Leave a Reply