Disable HTML form input autocomplete and autofill

disable-html-form-input-autocomplete-autofill.md

Disable HTML Form Input Autocomplete and Autofill

1. Add autocomplete="off" onto <form> element;
2. Add hidden <input> with autocomplete="false" as a first children element of the form.

<form autocomplete="off" method="post" action="">
    <input autocomplete="false" name="hidden" type="text" style="display:none;">
    ...

This formation is going to prevent Chrome and Firefox to offer autofill and autocomplete for all input fields inside the form.

What works in Chrome is the following:

<input type="text" autocomplete="new-text" />
<input type="number" autocomplete="new-number" />
<input type="password" autocomplete="new-password" />

this worked!
Also i have thw autocomplete="off" on the form field

This still working fine for me

<form autocomplete="off">
  <input type="text" name="username" autocomplete="off" />
  <!--OR-->
  <input type="text" name="email" autocomplete="off" />
  
  <input type="password" name="password" autocomplete="new-password" />
</form>

Best solution so far, worked great for me. Thx!

none of the above works for me :(

Strap in, this is a huge pain, but I figured out what's happening!

Apparently Chrome is using the label AND the id AND the name to help determine what to autofill. And I think it fills it if it finds a keyword in either of the two.

If your control name/id is "blah" and your label is "Username" - Chrome autofills
If your control name/id is "blah" and your label is "Usernaasme" - Chrome autofills (I think its looking for the word 'user')
If your control name/id is "blah" and your label is "Usasername" - Chrome doesnt autofill
If your control name/id is "username" and your label is "Usasername" - Chrome autofills

So it seems that both the label/id/name of the inputs need to not include the special words that Google is looking for.

I hope this saves someone else the hours it took me.

If you are using a stand alone <input> element, I've found that setting autocomplete="off, no, nope, false, blah, blah, whatever" does not work.

However, <input autocomplete="off"> will work if nested inside a <form> element.

I may be off on this... but this is what worked for me after testing many of the suggested solutions posted here.

It works, thanks

Strap in, this is a huge pain, but I figured out what's happening!

Apparently Chrome is using the label AND the id AND the name to help determine what to autofill. And I think it fills it if it finds a keyword in either of the two.

If your control name/id is "blah" and your label is "Username" - Chrome autofills If your control name/id is "blah" and your label is "Usernaasme" - Chrome autofills (I think its looking for the word 'user') If your control name/id is "blah" and your label is "Usasername" - Chrome doesnt autofill If your control name/id is "username" and your label is "Usasername" - Chrome autofills

So it seems that both the label/id/name of the inputs need to not include the special words that Google is looking for.

I hope this saves someone else the hours it took me.

Interesting find. Thank you. I have been struggling with this for a long time.