1

I came across this issue a few days ago. Do you anyone knew how to disable browser autocomplete on the Input element in React.js?? I already tried :

  • autoComplete="off"
  • autocomplete="new-password"

Both are not working.

Thank you for your answer.

Rahul Saini
  • 111
  • 2
  • 11
  • Read more on this large thread [here](https://stackoverflow.com/questions/2530/how-do-you-disable-browser-autocomplete-on-web-form-field-input-tag). Disable autocomplete on the form level, if you have one. And make sure to use `autoComplete`, with uppercase C. But even then, you could have suprises. – Nicolae Olariu Jan 02 '20 at 08:22
  • @NicolaeOlariu I don't have inputs in the form because I'm submitting this via another component. So I need to disable autoComplete on input level. – Rahul Saini Jan 02 '20 at 09:58

4 Answers4

2

Solution from https://www.codementor.io/@leonardofaria/disabling-autofill-in-chrome-zec47xcui

What solved the issue for me is setting the form fields to read only and then removing the attribute once the user focus them.

<input readonly="readonly" onfocus="this.removeAttribute('readonly');" type="text" value="test">
sɐunıɔןɐqɐp
  • 3,332
  • 15
  • 36
  • 40
Josh
  • 65
  • 6
  • Thanks for the solution. I used solution mentioned here https://medium.com/paul-jaworski/turning-off-autocomplete-in-chrome-ee3ff8ef0908 – Rahul Saini Aug 13 '20 at 09:29
0

On your input element delete the type attribute and all will be well. Also you don't need the autocomplete.

Kolyo Peev
  • 145
  • 2
  • 11
0

Yes, neither autoComplete="off" nor autocomplete="new-password" works with chrome.

Adding autocomplete attribute when input is focused works for me

onFocus={(event) => { event.target.setAttribute('autocomplete', 'off'); }}

Anne
  • 16
  • 3
0

The tags autoComplete="off" and autocomplete="new-password" does not work with browsers. Add this to the input tags and it will work as expected.

onFocus={(e) => e.target.setAttribute("autoComplete", "none")}
Darsh Shah
  • 675
  • 4
  • 4