How do I keep a form "clear"? It keeps auto populating with saved usernames

Question

I'm working on making a login page for my react app using react-bootstrap.

However, how do I keep my form clear? For example, I have saved logins but on Facebook for example, the form is always clear:

This is how mine looks -

How can I make mine clear each time?

Edit: I tried autoComplete="off" as follow, but it did not work:

<form autoComplete="off">
  <FormGroup controlId="formUsername">
    <FormControl type="text" placeholder="username"/>
  </FormGroup>
  <FormGroup controlId="formPassword">
    <FormControl type="password" placeholder="password" value=""/>
  </FormGroup>
</form>

The answer from the dupe that is important is here: http://stackoverflow.com/a/23234498/400654 TLDR: most modern browsers don't allow you to disable this functionality because it doesn't increase security. There are a few hacky workarounds and they're all listed in the answers within the dupe. — Kevin B, Jul 01 '16 at 22:39

score 0 · Answer 1 · answered Jul 01 '16 at 22:32

0

You are looking for <form autocomplete="off">

answered Jul 01 '16 at 22:32

zengr

36,384
37
121
187

Thanks. Actually, in the react docs it is autoComplete and I tried but doesn't work. – user1354934 Jul 01 '16 at 22:36
@user1354934 then why didn't you specify that in your question, with an included code sample? – Kevin B Jul 01 '16 at 22:36
sorry. i will add the code sample. – user1354934 Jul 01 '16 at 22:37

How do I keep a form "clear"? It keeps auto populating with saved usernames

1 Answers1