"AutoComplete=Off" not working on Google Chrome Browser [duplicate]

This is due to a design decision made by Chrome (arguably any Chrome user wants this behaviour).

The reason for this is what Google calls priority of constituencies:

1. The user is king! What they want matters most.
2. The user wants to use a password or autofill manager.
3. The web application says it doesn't want the form values to be saved.
4. The user's choice is more important, so the form values are retained.

There are ways to work round, but it's highly likely that those will be fixed in future Chrome versions as the Chrome developers regard their behaviour as correct and your workaround as a bug.

Even while your workaround does work it creates confusing behaviour for the user - they expect autofill to work according to their settings.

Many users already chose to ignore app autocomplete settings with plug-ins or scripts that just remove any autocomplete=off in the page - they already had that choice anyway.

You're best off designing with the assumption that autocomplete can work and accounting for that.

Personally I hate it when sites don't recall my password and override those that do with browser extensions. However I also create applications for my job and there recalling passwords is seen as a security risk, as a user might leave their machine unlocked. In my personal opinion users not locking their machines is an issue for local IT, not the application, and local IT can disable all password autocomplete for all web applications if their users can't be trusted.

Unfortunately to pass the security checks some applications still have to disable autocomplete, there are ways to do it, but they're all horrible. The first hack is to make the password input completely new:

<input type="hidden" name="password" id="realPassword" /><input type="password" name="{randomly generated}"     onchange="document.getElementById('realPassword').value = this.value" />

I've inlined everything to simplify, but this should give you an idea of the hack - no plug in or browser can auto-fill an input with a completely new name.

This solution breaks if you properly build in ARIA and labels (as that lets the browser/extension find and autofill the input from the label).

So option 2, also horrible, is to wait until after the autocomplete has fired and then blank the field:

<input type="text" name="username"     onchange="window.setTimeout(function() {         document.getElementById('password').value = '';     }, 100)" /><input type="password" id="password" />

Like I said, nasty.

It may be a bug on Google Chrome, you can't cheat by create an hidden input over. Auto complete feature will get the first input text to fill data.

<form autocomplete="off" id="search_form" method="post" action="">    <input type="text" style="display:none" />    <input autocomplete="off" type="text" /></form>

This seems to be a recurrent issue in Google Chrome, although adding autocomplete off to the form did work in my build. Maybe in newer versions it doesn't anymore.

This is a hack. Give your input an id, say foo, and in JavaScript:

if (navigator.userAgent.toLowerCase().indexOf('chrome') >= 0) {    setTimeout(function () {        document.getElementById('foo').autocomplete = 'off';    }, 1);}

Check if this works for you. The only downside to it would be that for those who use Chrome and have JavaScript disabled, the field would still be autocompleted.