Disable Firefox password manager for some password fields

Question

I have a registration form and login form. In the login form (mine), Firefox by default provides a username and password, which is normal. When registering, however, he does the same thing - this makes no sense, and this creates problems because the password field is entered, and the "repeat password" field is not.

Is there a way to change the HTML login form so that Firefox and other browsers do not autofill the specific password field?

EDIT . I found a lot of questions (and answers) on this topic, but the proposed solution (setting autocomplete=off in the password field) does not work for me on Firefox (it still autocompletes the field). I found this solution , but it seems a little ugly (and does not work if the user enters the username and ends up in Tab). Does anyone know a better way?

Answer 1

Found a simple and elegant solution , which should also be cross-browser. I can’t believe that I didn’t think about it - you just add another password entry right in front of yours and then hide it:

 <input style="display:none" type="password" name="foilautofill"/> <input type="password" name="notautofilledpassword" /> 

Beautiful. :)

Answer 2

In a situation where we have many users using the same computer with confidential information, we had to turn off password auto-completion. At first I tried your "simple and elegant" solution for hidden passwords, but a smart user showed me that everyone can use the browser developer tools to display the automatically completed password of the previous user in text form in a hidden field.

I turned off password auto-completion in a safe way as follows. This works in Firefox 29 and IE8:

---

Create a password field dynamically and add it to the form on the page load. Give it a placeholder attribute.

 function createPasswordInput() { var dynpass = document.createElement("input"); dynpass.setAttribute("type", "password"); dynpass.setAttribute("size", 32); dynpass.setAttribute("id", "dynPwElem"); // placeholder helps prevent password autocomplete dynpass.setAttribute("placeholder", "Enter password"); // append the password element to the form, in my case an empty table cell var td = document.getElementById("dynamicTd"); td.appendChild(dynpass); var rpw = document.getElementById("dynPwElem"); rpw.setAttribute("name", "userPassword"); // Max length starts at only 1, helps prevent autocomplete. // Use property maxLength instead of setAttribute to work in IE rpw.maxLength = "1"; // set the DOM property that has uppercase L 

---

Set the maxLength property of the password element to only 1 and attach an onfocus event to expand maxLength to what it should (32 in my case).

 function expandPwLength() { var rpw = document.getElementById("dynPwElem"); // use property maxLength instead of setAttribute to work in IE if (rpw.maxLength < 32) { rpw.maxLength = 32; } } // attach focus event to expand the password field length if (rpw.addEventListener) { rpw.addEventListener("focus", expandPwLength, true); } else { rpw.attachEvent("onfocus", expandPwLength); // IE <= 8 } 

---

Prevent form submission if the user types "Enter" in the user ID field using a keypress event listener. Instead, move the cursor to the password field.

 function preventAutocomplete (charCode) { if (charCode == 13) { // instead of autocompleting password, navigate to the password field. document.getElementById("dynPwElem").focus(); } } } 

---

In the same keystroke event listener, shorten the auto-complete property of the password item.

 if (charCode == 13 || charCode == 40) // the Enter key, or the Down-arrow key document.forms["loginSubmitForm"].userPassword.autocomplete = ""; 

---

Set the property of the entire "auto-complete" form to "off" using JavaScript when the page loads, and not in the HTML tag.

 document.forms["loginSubmitForm"].autocomplete="off"; 

Answer 3

Just before I get to this point, I solved a problem that is almost as elegant as John Dodo mentioned, and as safe as Missilton. Enter an invisible dummy user input field directly in front of the password input field and fill it with the JS / JQuery code with a nonexistent username. Firefox will look for a password for this user to show his password, but, of course, this will fail. I used this for our Change Password page and viewed Firefox behavior as an error. The browser should only fill in the saved password in the URL where it was stored, and not on other pages.

Here is my jQuery / html code:

 <script language="javascript" type="text/javascript"> $("#dummyusername").ready(function () { $("#dummyusername").val("joe_x_dummy"); }); </script> <input style="display:none" type="text" name="dummyusername" id="dummyusername" /> <input type="password" name="oldpassword" ...