Encodera

Thanks for reading!

Donate to the site — we work hard for you.

How to turn off or set up field autofill

Short answer

The autocomplete="off" attribute asks the browser not to suggest previously entered values:

<input name="code" autocomplete="off" placeholder="One-time code">

It can also be set on the whole form: <form autocomplete="off">.

Better to hint than to forbid

More often autofill helps rather than hurts — you only need to tell the browser what the field holds. Then it fills in the right data with one tap:

<form style="display: grid; gap: 6px; max-width: 260px;">
  <input name="name" autocomplete="name" placeholder="Full name">
  <input name="email" type="email" autocomplete="email" placeholder="Email">
  <input name="phone" type="tel" autocomplete="tel" placeholder="Phone">
</form>

The most needed values: name, email, tel, street-address, postal-code, cc-number, one-time-code, current-password, new-password.

Passwords

On sign-up and password change, use autocomplete="new-password": the browser offers to generate a strong password instead of filling in the old one. For signing in — current-password.

Common mistake

autocomplete="off" is put on a password field to "protect" it. Browsers ignore this request for passwords, and if they obeyed, users would pick simple passwords that are easy to remember. Do not get in the way of password managers — mark the fields with the right values.

Functions used in this recipe

  • autocomplete — Tells the browser which saved data to fill into a field.
  • <input> — An input field; its kind is set by the `type` attribute.
  • <form> — A form: collects data from its fields and sends it to the server.
  • spellcheck — Turns spell checking in a field on or off.

Thanks for reading!

Donate to the site — we work hard for you.