HTML Autocomplete Attribute

The autocomplete attribute defines if an input or a form field must have the autocomplete "on" or "off".

With the autocomplete attribute the browser predicts the value, and when a user starts typing in a field, the browser displays options to fill in the field, based on earlier typed values.

The autocomplete can be "on" for the input, and "off" for particular input fields, or vice versa.
Note: The autocomplete attribute works with such <input> types, like text, search, tel, url, password, email, range, and color.

Syntax

<input autocomplete="on|off">
Applies to <form> and <input> elements.

Example of the HTML autocomplete attribute:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      div {
        margin-bottom: 10px;
      }
    </style>
  </head>
  <body>
    <form action="/form/submit" method="get" autocomplete="on">
      <div>
        <label for="name">Enter Your Name:</label>
        <input type="text" name="name" id="name">
      </div>
      <div>
        <label for="phone">Enter Your Phone Number:</label>
        <input type="number" id="phone" name="phone-number">
        <br>
      </div>
      <input type="submit" value="Send">
    </form>
  </body>
</html>

Example of the HTML <form> tag where the autocomplete attribute is on:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      input {
        display: block;
        margin-bottom: 10px;
        padding: 10px;
      }
    </style>
  </head>
  <body>
    <form action="/form/submit" accept-charset="ISO-8859-1">
      <input type="text" name="name" placeholder="Enter your Name" autofocus>
      <input type="text" name="surname" placeholder="Enter your Surname">
      <input type="number" name="age" placeholder="Enter your Age" autocomplete="off">
      <input type="submit" value="Send">
    </form>
  </body>
</html>



Do you find this helpful?

Related articles