Differentiating multiple forms on one site for autocomplete

6
votes

What's the logic behind browsers autocomplete - how do they differentiate between multiple forms on one site or even page? Let's assume a situation where you have an ecommerce-site with a login (user/pass) and gift-cards on checkout (giftcardnumber/pass). How do you tell a browser that these are not the same fields and must be stored separately?

Of course we could just disable autocomplete on the 2nd form, but that's not a pretty solution.

Is there a standard on autocompletion? Is the forms ID the key for storing it? Since Windows 10, the situation seems to be even more complicated, thanks to the cloud-sync feature, which syncs passwords and other form-values across browsers.

Thanks!

2
htmlformsautocomplete
Which browser/OS specifically? Is this about the auto-complete dropdowns on each input element, or some smarter tool like Chrome's Autofill? - approxiblue
also some code and a code example would be helpful for context - Jonathan Marzullo

2 Answers

2
votes

Here's a good answer that explains a little on how browser's determine autocomplete

Basically, browser's rely on the "name" attribute of an input and a lot of other contextual information (class/input type/label) to determine what fields can be autocompleted with what (type) of information.

Here's is a little more detail on the autofill html standard. https://html.spec.whatwg.org/multipage/forms.html#autofill

-1
votes

If I understand you correctly you're looking for how to turn on/off fields from auto-completing?

You can use set the whole form to auto-complete with something like:

<form autocomplete="on|off">

and you can set auto-complete on or off per field with something like:

<form action="demo_form.asp" method="get">
  First name:<input type="text" name="fname" autocomplete="on"><br>
  E-mail: <input type="email" name="email"><br>
  <input type="submit">
</form>

Note that this will only auto-complete for fields that the user has already auto-completed on other forms in the browser's history

You can learn more about it here (and even try it out): http://www.w3schools.com/tags/att_form_autocomplete.asp

Also see this link on field specific autocompletes: http://www.w3schools.com/tags/att_input_autocomplete.asp