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.

Show comment
Hide comment
@zanderwar

zanderwar Mar 20, 2017

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

zanderwar commented Mar 20, 2017

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

@Westie

This comment has been minimized.

Show comment
Hide comment
@Westie

Westie 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]

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.

Show comment
Hide comment
@jehzlau

jehzlau Oct 9, 2017

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

jehzlau commented Oct 9, 2017

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

@Fellach

This comment has been minimized.

Show comment
Hide comment
@Fellach

Fellach 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

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.

Show comment
Hide comment
@RedSparr0w

RedSparr0w 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.

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.

Show comment
Hide comment
@WarenGonzaga

WarenGonzaga Dec 26, 2017

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

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.

Show comment
Hide comment
@eloisetaylor5693

eloisetaylor5693 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

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.

Show comment
Hide comment
@swt83

swt83 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.

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.

Show comment
Hide comment
@anik786

anik786 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.

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.

Show comment
Hide comment
@zhoolu

zhoolu Mar 8, 2018

@anik786

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

zhoolu commented Mar 8, 2018

@anik786

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

@kcaporaso

This comment has been minimized.

Show comment
Hide comment
@kcaporaso

kcaporaso 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.

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.

Show comment
Hide comment
@marc-thomas

marc-thomas May 14, 2018

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

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.

Show comment
Hide comment
@thdoan

thdoan 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).

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.

Show comment
Hide comment
@kingdonb

kingdonb 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.

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.

Show comment
Hide comment
@hugocruz

hugocruz 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)

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.

Show comment
Hide comment
@benbonnet

benbonnet Jun 29, 2018

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

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.

Show comment
Hide comment
@jprasmussen

jprasmussen Jul 6, 2018

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

jprasmussen commented Jul 6, 2018

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

@Acidic9

This comment has been minimized.

Show comment
Hide comment
@Acidic9

Acidic9 Jul 9, 2018

Nothing seems to work for me in Google Chrome..

Acidic9 commented Jul 9, 2018

Nothing seems to work for me in Google Chrome..

@Abolfazl

This comment has been minimized.

Show comment
Hide comment
@Abolfazl

Abolfazl Jul 10, 2018

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

Abolfazl commented Jul 10, 2018

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

@raphael22

This comment has been minimized.

Show comment
Hide comment
@raphael22

raphael22 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 !

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.

Show comment
Hide comment
@erik2504

erik2504 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....

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.

Show comment
Hide comment
@fschlaef

fschlaef 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.

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.

Show comment
Hide comment
@JefferyHus

JefferyHus 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

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.

Show comment
Hide comment
@lancegliser

lancegliser 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

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.

Show comment
Hide comment
@Adavis619

Adavis619 Aug 13, 2018

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

Adavis619 commented Aug 13, 2018

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

@MissIrina

This comment has been minimized.

Show comment
Hide comment
@MissIrina

MissIrina Aug 14, 2018

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

MissIrina commented Aug 14, 2018

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

@GuiDeto

This comment has been minimized.

Show comment
Hide comment
@GuiDeto

GuiDeto Aug 14, 2018

autocomplete="new-password"

GuiDeto commented Aug 14, 2018

autocomplete="new-password"

@mitchellurgero

This comment has been minimized.

Show comment
Hide comment
@mitchellurgero

mitchellurgero 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?!

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.

Show comment
Hide comment
@imegory

imegory 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.

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.

Show comment
Hide comment
@IamCharmaineJoy

IamCharmaineJoy Sep 26, 2018

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

IamCharmaineJoy commented Sep 26, 2018

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

@greenjackal

This comment has been minimized.

Show comment
Hide comment
@greenjackal

greenjackal Sep 28, 2018

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

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.

Show comment
Hide comment
@rubensfernandes

rubensfernandes Oct 17, 2018

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

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.

Show comment
Hide comment
@chriscooning

chriscooning 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.

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.

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