Instantly share code, notes, and snippets.

Embed
What would you like to do?
Disable HTML form input autocomplete and autofill

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.

Disable HTML form input autocomplete and autofill

@zanderwar

This comment has been minimized.

zanderwar commented Mar 20, 2017

Wrong, false is not an option on autocomplete, all must be off

@Westie

This comment has been minimized.

Westie commented Mar 21, 2017

In addition, autocomplete=off is also a nonsense as most browsers refuse to adhere to this - the best way is to make an element [readonly] and then on hover/click/blur/focus, remove [readonly]

@jehzlau

This comment has been minimized.

jehzlau commented Oct 9, 2017

+1 to Zanderwar, false is not working. I just tried it now. :D

@Fellach

This comment has been minimized.

Fellach commented Oct 13, 2017

@zanderwar, @jehzlau,

please read Turning_off_form_autocompletion, where it stays:

many modern browsers do not support autocomplete="off" for login fields

@RedSparr0w

This comment has been minimized.

RedSparr0w commented Nov 17, 2017

@Fellach The link you posted states that they do not support autocomplete="off" for login fields, all other input fields should be fine.

many modern browsers do not support autocomplete="off" for login fields

It also says you should use autocomplete="new-password" for new password fields (can be used in login fields) in order for it to not be auto filled.

If an author would like to prevent the autofilling of password fields in user management pages where a user can specify a new password for someone other than themself, autocomplete="new-password" should be specified, though support for this has not been implemented in all browsers yet.

@WarenGonzaga

This comment has been minimized.

WarenGonzaga commented Dec 26, 2017

This is helpful for me... thanks for sharing and also some comments here are helpful!

@eloisetaylor5693

This comment has been minimized.

eloisetaylor5693 commented Jan 4, 2018

Using false (or any other string that's not on or off) is a valid workaround. See bug: https://bugs.chromium.org/p/chromium/issues/detail?id=468153#c164

@swt83

This comment has been minimized.

swt83 commented Jan 12, 2018

I had to use false to get this to actually stop the auto-fill, and I had to do it on each individual form element instead of just the form itself. This is a pretty big problem.

@anik786

This comment has been minimized.

anik786 commented Mar 1, 2018

This works, but not the way that you think it does.

Officially it should be: autocomplete="off". However many browsers bizarrely ignore this.

Therefore it's best to just put some random string on the autocomplete section like:

autocomplete="autocomplete_off_hack_xfr4!k"

That's why autcomplete="false" accidentally works.

Note that make sure the autocomplete value for each input is different. Hence the random string at the end. Or else you may get suggestions from fields with the same autocomplete value.

@zhoolu

This comment has been minimized.

zhoolu commented Mar 8, 2018

@anik786

Thanks, this worked like a charm, autocomplete="anyrandomstring".

@kcaporaso

This comment has been minimized.

kcaporaso commented May 3, 2018

These tricks no longer seem to work in Chrome 66.0.3359.139. I was using autocomplete="nope" and all of a sudden autocomplete is back on those forms. Frustrating, and this is for non-login forms, things like address, city.

@marc-thomas

This comment has been minimized.

marc-thomas commented May 14, 2018

autocomplete="random" does not work anymore for type="password" fields - seems to work with type="text" and other field types :(

@thdoan

This comment has been minimized.

thdoan commented May 15, 2018

According to MDN, "many modern browsers do not support autocomplete="off" for login fields," in which case I assume the random value hack would also not work (basically modern browsers will just ignore this attribute altogether for login fields).

@kingdonb

This comment has been minimized.

kingdonb commented May 30, 2018

@kcaporaso I think that Chrome must have finally relented on their contrarian interpretation of the standard. I'm encountering this issue for the first time, and autocomplete="off" on the form tag seems to work, even in spite of thousands of complaints scattered across every help site on the internet claiming to the contrary.

Thank you for your post, I was beginning to think I was crazy but if I'm right and you're right, then I guess the behavior has been changed by an update within the last month or two.

@hugocruz

This comment has been minimized.

hugocruz commented Jun 18, 2018

As @thdoan referenced the MDN article explains more about it.
Most relevant for me was:

In some cases, the browser will continue suggesting autocompletion values even if the autocomplete attribute is set to off. This unexpected behavior can be quite puzzling for developers. The trick to really enforcing non-autocompletion is to assign an invalid value to the attribute, for example:

autocomplete="nope"

Since this value is not a valid one for the autocomplete attribute, the browser has no way to match it, and stops trying to autocomplete the field.

This explains why false works as stated above.

Edit: I'm using Chrome Version 67.0.3396.87 (Official Build) (64-bit)

@benbonnet

This comment has been minimized.

benbonnet commented Jun 29, 2018

@kingdonb so then I'll scatter another one here as it looks like the issue is back again, stronger than ever

@jprasmussen

This comment has been minimized.

jprasmussen commented Jul 6, 2018

Adding autocomplete="off" to a text input worked for me in Chrome.

@Acidic9

This comment has been minimized.

Acidic9 commented Jul 9, 2018

Nothing seems to work for me in Google Chrome..

@Abolfazl

This comment has been minimized.

Abolfazl commented Jul 10, 2018

I have tried various options and nothing is working for me in Chrome.

@raphael22

This comment has been minimized.

raphael22 commented Jul 17, 2018

So... autocomplete='off' trigger a warning telling me to precise my autocomplete...
autocomplete='false' or another value not in spec does remove the warning but try to autocomplete with previous value known by the input...
This spec is a ****ing mess !

@erik2504

This comment has been minimized.

erik2504 commented Jul 25, 2018

It's back again indeed. In v68 it ignores all known workarounds to prevent auto-filling fields.
autocomplete="random-string-here" is broken. The autocomplete="off" gets ignored. Even using the method where you make your fields readonly and remove that attribute on focus doesnt seem to work anymore....

@fschlaef

This comment has been minimized.

fschlaef commented Jul 25, 2018

Nothing works. All my search fields retain recently entered values, which is completely idiotic, and tons of developers are looking like idiots for not being able to remove this, all because Google thinks their idea of "user experience" is the best and nobody should question it. Very well done.

@JefferyHus

This comment has been minimized.

JefferyHus commented Jul 25, 2018

Since everyone is pissed off by google, maybe this trick can help you around, assign wrong values to autocomplete attribute.
https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion

@lancegliser

This comment has been minimized.

lancegliser commented Aug 1, 2018

I'm currently forced to do a browser specific sniff. If it's chrome, use autocomplete="disabled" which handles both autocomplete and address based autofill (two separate things):

// Weird browser specific hack, because autofill isn't autocomplete
// Chrome demands disabled to turn it off
element.autocomplete = isGoogleChrome() ? 'disabled' :  'off';

For reference, here's the most up to date sniffer I found:
https://stackoverflow.com/questions/4565112/javascript-how-to-find-out-if-the-user-browser-is-chrome

I feel terrible having to do this

@Adavis619

This comment has been minimized.

Adavis619 commented Aug 13, 2018

autocomplete="off" works for me in IE, Chrome, and FF.

@MissIrina

This comment has been minimized.

MissIrina commented Aug 14, 2018

This worked for me -> autocomplete="anyrandomstring".

@GuiDeto

This comment has been minimized.

GuiDeto commented Aug 14, 2018

autocomplete="new-password"

@mitchellurgero

This comment has been minimized.

mitchellurgero commented Aug 17, 2018

None of this worked for me so I used (Requires jQuery):

...
<input class="user" type="password" id="pass" class="form-control" placeholder="Account Password" name="password" value="" readonly>
...

<script>
$( document ).ready(function() {
    setTimeout(function(){
        $("#pass").attr('readonly', false);
        $("#pass").focus();
    },500);
});
</script>

Which so far has worked in IE10+, Chrome, Firefox, Safari, etc. (Pretty much every web browser used in this day and age.)

Also works in IE9, but who uses that?!

@imegory

This comment has been minimized.

imegory commented Sep 22, 2018

My two cents on this subject: on Chrome, autocomplete="nope" seems to work. Trying autocomplete="off" seems to be ignored by Chrome. I am pretty amazed that this has not been settled at the W3C level.

@IamCharmaineJoy

This comment has been minimized.

IamCharmaineJoy commented Sep 26, 2018

autocomplete="off" works for me in Chrome 69 on macOS (Sierra) and safari

@greenjackal

This comment has been minimized.

greenjackal commented Sep 28, 2018

A jQuery plugin can solve this problem for all browsers.
https://github.com/terrylinooo/jquery.disableAutoFill

@rubensfernandes

This comment has been minimized.

rubensfernandes commented Oct 17, 2018

use autocomplete="anyrandomstring"
And dont use id="password" or id="email", use anything else like id="field1" this should be works!

@chriscooning

This comment has been minimized.

chriscooning commented Oct 17, 2018

having to change the name of the id seems very wrong / broken to me - this is especially tedious when you have large forms.
The jQuery plugin is the only thing I've found that works in chrome.

What a shame.

@jbgraug

This comment has been minimized.

jbgraug commented Oct 25, 2018

Just remove the name attribute

@CharlyPoppins

This comment has been minimized.

CharlyPoppins commented Nov 6, 2018

Nice workaround, thank you :)

@salmanmd786

This comment has been minimized.

salmanmd786 commented Nov 14, 2018

Just remove the name attribute

After so many trails, luckily your solution works. Kudos.

@DanNeely

This comment has been minimized.

DanNeely commented Nov 21, 2018

The jquery plugin is also preventing the PW from being *ed out by default. That's terrible in a different way.

@mandaputtra

This comment has been minimized.

mandaputtra commented Nov 28, 2018

You should updated this gist man, many person googled see this

@dhniels

This comment has been minimized.

dhniels commented Nov 30, 2018

The only thing I've been able to get to work is autocomplete="new-password" on each input i want it disabled (see the answer by "tibalt" in this stack overflow post)

only tested on chrome 70 so far.

Is there any "one size fits all" solution for this? This spec seems to be a total shitshow. Dependent on browser, attributes, type, input-only vs. form-wide, mobile vs desktop, etc. Disastrous.

UPDATE: testing on chrome, if I had a name attribute, it breaks. so this only works (in chrome, anyway) if name is not set.

@mariusrazoux

This comment has been minimized.

mariusrazoux commented Dec 3, 2018

<input type="text"
      id="search"
      autocomplete="off"
      autocorrect="off"
      autocapitalize="none"
      spellcheck="false" />

works for me without removing the name attr

@lmpampaletakis

This comment has been minimized.

lmpampaletakis commented Dec 4, 2018

The thing is to work for passwords too. And when I say work, I mean one solid solution

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment