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.

@eduardo-mior thats a hack not a solution, I need the use the name attribute as a name attribute

You can try these steps one by one, I'm not sure which one suits your condition.

• add this attr autocomplete="new-password" to your input.
• remove attr name
• change autocomplete attr's value to autocomplete="new" (Tested in some latest version of browser)

@moosefaceee You can have an attribute called "x-original-name" to save the original "name" and change the "name" to a random value.

For those who stumbled here like I did many times, this works (at least for now):

<input role="presentation" autocomplete="off" />

You don't need to delete ID or have dynamic names.

most clean solution!

For those who stumbled here like I did many times, this works (at least for now):

<input role="presentation" autocomplete="off" />

You don't need to delete ID or have dynamic names.

most clean solution!

Just FYI: role presentation will hide the input from screen readers. Making your form inaccessible. :\

Yip, @graphical-iain, just another hack attempt.

@johan44co, rather go comment here https://issues.chromium.org/issues/40910184.

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" />

I tested everything that was suggested here, and the only thing that really worked was applying the autocomplete="off" to the form wrapping the fields. I won't allow the browser to autocomplete. And if you don't have the <form>, you must add it like this:

<form autoComplete='off'>

Applying only to the fields did not work for me.

This works for me on fresh Chrome v. 122.0 (more info here)

<input autocomplete="nope" ... />

(I test it in my angular dropdown component - works also without <form> wrapper)

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>

<input autocomplete="new-password" />

This is the way. Here is why.

Atrocious.

You can try this...

<form action="" autocomplete="off">

<input type="text" required autofocus aria-autocomplete="none">

<input type="text" required aria-autocomplete="none">

</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