CODEWITHSUNDEEP
google-chromeautocomplete
jojo____
jojo____

Reputation: 257

Disable autocomplete for Chrome 66

With chrome 66 I couldn't find a way to disable autocomplete on text inputs like it used to work. I tried autocomplete="off" and autocomplete="new-password" which worked until Chrome 63 I think but doesn't anymore.

Is there a new way to disable this feature ?

Thanks !

Upvotes: 11

Views: 4668

Answers (4)

Moos
Moos

Reputation: 535

Just ran into this -- Google looks at the fields id or name to determine if it has saved data for that field. As a site author, use a randomly generated name/id, and/or add an autocomplete=<random string> to the field.

See this playground: https://jsfiddle.net/mfdc22pz/1/

BTW Chrome Canary (68) fixes this bug!

In Short: Add random tags like: name="foo_90553-4"

Upvotes: 5

Dario Latini
Dario Latini

Reputation: 21

I resolved using a little jQuery (but you can use a simple javascript).

The problem is that chrome looks at the name and/or the id of your fields. The only solution I found is to remove those attributes, add an data-name attribute with the real name of the field, and re-attach the name attribute after the submit using javascript.

There is an example

<form onsubmit="return formSubmit(this);" autocomplete="off">
    <input type="text" data-name="dateStart" class="form-control" />
</form>


<script>
function formSubmit(form) {
  console.log(form);
  $(form).find('.form-control').each(function(){
    $(this).attr('name', $(this).data('name'));
  });
  console.log(form);
  query = jQuery(form).serialize();
  window.open("/YOUR_URL/?" + query, "_self");
  return false;
};
</script>

Upvotes: 2

eug
eug

Reputation: 1158

What's working for me is using a non-password input that pretends to have a password mask - battling the browser vendors to turn off autocomplete on actual password fields will probably end in frustration..

Here's a sandbox: https://codesandbox.io/s/yp3pyl4rkv

A similar approach with more features is at https://github.com/karaggeorge/react-better-password

Upvotes: 0

K.Dinh
K.Dinh

Reputation: 39

I got the same issue. Work around with insert invisible input make it like first input on page.

[Html] ... ... [css] ... .invisible_input{height: 0.1px;position: absolute;margin-top: -500px;} ...

But waiting for answer from chrome developer:/ I hope this help you! enter image description here

Upvotes: 1

Related Questions