Remembering email and password - html

I have the following problem. When I remember email and password on chrome email fills the latest email field on the page, but not the right one. Here is the image:
This happens on a register page also: but it shouldn't be here.
How could this be solved?

If you wish to prevent users from having inputs automatically filled out based on previously entered values which the browser stored, you can use the autocomplete="off" parameter on the input.
Eg. <input type="password" id="foo" autocomplete="off" ...>

Related

How to get rid of autofill in a form on locally developed page

I'm building a site locally and in one form I have a phone number input and a password input. Chrome is pre-filling these fields, the phone number with my email address, and the password field with a password as shown.
This is a registration page so I don't want the password field pre-filled and the phone number should not contain an email address.
This is the markup of these inputs:
<input type="tel" value="" id="phone" name="phone" class="input ">
<input type="password" placeholder="Min 10 characters" id="password" name="password" class="input ">
Things I have tried to disable chrome autocomplete, all of which have had no effect:
Adding the autocomplete="off"/autocomplete="false" to both the inputs themselves and the outer form element.
Cleared autocomplete data from browser history from the beginning of time.
Changing the ID and the name attributes of the inputs in question.
The only thing that prevents chrome autocompleting the input is to add another phone input before and style it as hidden, which is a horrible hack I want to avoid.
What is the cause of chrome inserting an email address into a tel input with name phone? How can I prevent this behaviour?
I'm not worried about completely disabling autocomplete but I don't want it inserting email addresses into phone-number inputs.
Open Chrome.
At the top right, click Settings.
At the bottom, click Show advanced settings.
Under "Passwords and forms," click Manage Autofill settings.
Point to the entry (in your case: phone-number inputs) and click
Delete Close.
Note: email addresses has been filled in the phone number input field instead of phone number.

How does Google Chrome recognize a login form?

I faced an issue recently where Google Chrome offers to save username and password for a login form, but took a different field value than the username-field to store as username.
Does anyone know which criteria are used by chrome to determine the username and password in a login form?
My guess (but cannot find documentation to proof it):
take first text-field as username
take first password field as password
When a website developer creates a login form on their website, they usually add specific HTML tags to the form to identify it as a login form. When a user visits the website and clicks on the form, the browser recognizes the HTML tags and knows that the form is a login form. The browser may then offer to save the user's login information, so that the user doesn't have to enter it every time they visit the website.
Here is an example of a login form with HTML tags:
<form action="/login" method="post">
<label for="username">Username:</label><br>
<input type="text" id="username" name="username"><br>
<label for="password">Password:</label><br>
<input type="password" id="password" name="password"><br><br>
<input type="submit" value="Submit">
</form>
In this example, the form tag specifies that this is a form, and the input tags with the type attribute set to "text" or "password" specify that this is a login form.

autocomplete on form with two password fields

I'm having a problem with a form with two password fields. I have a form with three input fields: name (text), id (password), and PIN (password). My browser stores the password from PIN & autocompletes it back into the id field next time I visit the page. The PIN field is initialized empty.
Is there a way to have the ID number stored as the saved password & PIN left blank? I've tried adding an "autocomplete=off" attribute in the PIN input field with no effect.
FWIW, I'm using Firefox & trying not to use javascript.
Any suggestions (or documentation on how autocomplete/password saving actually works inside any browser) would be appreciated.
Kent
If autocomplete="off" is not working, you should add <input type="password" style="display: none;"/> before any password input. It will hold completed password and will not interfere with anything.
<input name="password" type="password" autocomplete="off"> should do it in firefox.
See this answer: Is autocomplete="off" compatible with all modern browsers?
Did you put the off in quotes?

Weird input text and input password erasing default input password

I have a simple text and password input with default username and password filled out. If I put focus on the text input and then remove the focus, it erases my password input for some reason. This only seems to happen on firefox. I thought it would be my surrounding code, but I tried moving everything to a blank page and stripped everything to the bare bones with no luck:
<form>
<input type="text" value="username" />
<input type="password" value="password" />
</form>
A few things I noticed were it doesn't matter what value I change the username and password to, I still get this problem. If I remove the opening form tag, this problem disappears. If I swap it around and put the password first then followed by the username, it will work... Another weird thing is if I run this file from my operating system path the problem also disappears. Anyone have any idea what could be the problem?
Sounds like Firefox's form field auto-completion is getting in your way. You can disable it by adding autocomplete="off" to the <input> fields or to the <form> element to disable it for all fields.
It seems like it is Firefox(at least 3.5.1) Password manager behavior. On blur it looks for very next input field in DOM tree and if there is a password field then manager replaces current value with one what was stored before or with empty string if no matches found.
To ensure it you can try to enter stored for this page/domain user name into input and remove focus. FF will substitute stored password.
As a workaround you can insert <input id="dummy" type="text" style="display:none;" /> between text and pass fields. This will break common markup pattern on which FF relies.

How do I suppress firefox password field completion?

I'm developing a website. I'm using a single-page web-app style, so all of the different parts of the site are AJAX'd into index.php. When a user logs in and tells Firefox to remember his username and password, all input boxes on the site get auto-filled with that username and password. This is a problem on the form to change a password. How can i prevent Firefox from automatically filling out these fields? I already tried giving them different names and ids.
Edit: Someone has already asked this. Thanks Joel Coohorn.
From Mozilla's documentation
<form name="form1" id="form1" method="post" autocomplete="off"
action="http://www.example.com/form.cgi">
[...]
</form>
http://developer.mozilla.org/en/How_to_Turn_Off_Form_Autocompletion
The autocomplete="off" method doesn't work for me. I realized firefox was injecting the saved password in the first password field it encountered, so the solution that worked for me was to create a dummy password field before the password update field and hide it. Like so:
<input type="password" style="display: none;" />
<input type="password" name="password_update" />
Have you tried adding the autocomplete="off" attribute in the input tag? Not sure if it'll work, but it is worth a try.
are all your input boxes set to type=password? That would do it. One of the things you can do, and I'm not at all sure that this is the best answer is to leave input box as an input type and just use javascript and onkeydown event to place stars in the input box instead of having the browser render it. Firefox won't pre-fill that.
As an aside, I have had to work on single-page web-apps and I absolutely hate it. Why would you want to take away the user's ability to bookmark pages? To use the back button?
Adding to this answer https://stackoverflow.com/a/30897967/1333247
This is in case you also have a User field in front of the password fields and want to disable autocompletion for it too (e.g. router web config, setting proxy User and Password).
Just create a dummy user field in front of the dummy password field to hide user name autocompletion:
<input type="text" style="display: none;" />
<input type="password" style="display: none;" />
<input type="password" name="password_update" />
Per the docs this is about the Login autocompletion. To disable the normal one (e.g. search terms completion), just use the
autocomplete="off"
attribute on the form or inputs. To disable both you need both, since the attribute won't disable Login autocompletion.