I'm using Opencart for my ecommerce and point-of-sale website. Because we do point-of-sale (producing a quote/order for a customer on their behalf), I have to create customer profiles all the time. Username, password, etc.
I used <form autocomplete="off"> on our customer account creation page, but it appears with the newest version of Chrome, autocomplete="off" is ignored, and so the customer's password is always defaulted to my admin password for the site. This is very annoying. Safari has the same issue.
Any way around this other than complete hacks?
It should be possible to turn off autocomplete with a "--disable-ignore-autocomplete-off" flag (chrome 34).
I found solution of this problem. It is not elegant but working. Usually browser's autocomplete tries to set saved password into a type="password" field and an email (or login) into the field before it. So you should change type of your password input to 'text'.
<input type="text" name"password" id="password_input" />
And then change it back to 'password' with Javascript
setTimeout(function (){
$('#password_input').attr('type', 'password');
}, 500);
Without timeout it won't work in Safari.
Related
We are developing an online hotel CRM system in DevEx environment and there is member registration form in our system.
Our customers said that there is a huge problem for their hotel customers when they try to sign up. As you may know in Safari Browser there is a icloud Keychain speciality to keep your most used password and automatically put that password while you try to fill registration form in browser. So if a hotel customer tries to register from safari browser and if they activated Keychain they can't enter their password into registration form.
What i need to know is how should i force safari browser to disable that Keychain speciality ?
Take a look at this thread: Safari Keychain prevent with html
Seems there is a Jquery plugin which means all you have to do once you've added it is add the following to your input fields:
spellcheck="false" autocomplete="off"
There fore making your input fields look something like this:
<input type="hidden" id="txtPass" name="txtPass" spellcheck="false" autocomplete="off">
<input type="text" id="txtPass" name="txtPass" spellcheck="false" autocomplete="off">
Link to the Jquery Plugin is here: http://plugins.jquery.com/disable-autocomplete/
But like I said you get more information in the previos thread I linked too.
Hope this helps
My web application is written using MVC5 and C#.
I have 2 pages where a user can enter their username and password. One of them is the Request Account page, the other is the Login page.
I am seeing different behavior of the Save Password prompt across IE, Chrome and FireFox.
The URIs are:
/Account/RequestAccount
/Account/Login
FIREFOX - Prompts user to Save Password on either page. On submission of the Request Account form the user is offered to save the username/password. If the user opts to save the password FireFox will perform autocomplete when the user returns to the Login form. This behavior is desired and seems correct.
IE & CHROME - Neither of these browsers offer to save the username/password when the Request Account form is submitted. However both browsers offer to save username/password when the user submits the Login form.
Honestly, I don't see how IE or Chrome can make a distinction based on URI and I don't believe that they do. This leaves me with suspecting there may b something incorrect with my form fields except that they work fine on the Login page.
Both of my Login and Request Account pages use identical form field IDs (UserName and Password).
<input class="form-control valid" data-val="true"
data-val-email="The Username field is not a valid e-mail address."
data-val-required="The Username field is required." id="UserName" name="UserName"
type="email" value="" aria-required="true" aria-invalid="false">
<input class="form-control" data-val="true"
data-val-required="The Password field is required." id="Password" name="Password"
type="password">
My question, is there something specific that needs to be done in the Request Account page form fields to trigger the Save Password prompt like FireFox does? Or, does IE and Chrome dismiss the Request Account page as not being an actual login page (somehow)?
Does adding the autocomplete="on" property helps?
IE11 will no longer support it though:
http://msdn.microsoft.com/en-us/library/ie/ms533486%28v=vs.85%29.aspx
I have an admin form with username and password fields that is being filled in by Chrome as it has a username and password remembered.
I would like to prevent these fields to be automatically filled.
I did lots of search and already tried the autocomplete tag (in input and form), displany:none in style tag and the javascript call to dissabled autocomplete... and nothing of these worked.
Can you please give me a hand?
Thanks!
link to gist https://gist.github.com/runspired/b9fdf1fa74fc9fb4554418dea35718fe
<!--
<form autocomplete="off"> will turn off autocomplete for the form in most browsers
except for username/email/password fields
-->
<form autocomplete="off">
<!-- fake fields are a workaround for chrome/opera autofill getting the wrong fields -->
<input id="username" style="display:none" type="text" name="fakeusernameremembered">
<input id="password" style="display:none" type="password" name="fakepasswordremembered">
<!--
<input autocomplete="nope"> turns off autocomplete on many other browsers that don't respect
the form's "off", but not for "password" inputs.
-->
<input id="real-username" type="text" autocomplete="nope">
<!--
<input type="password" autocomplete="new-password" will turn it off for passwords everywhere
-->
<input id="real-password" type="password" autocomplete="new-password">
</form>
I found a work around for chrome. I have not tried this on any other browser. Load the password field as a type="text" then when the page is finished loading change the type to password chrome will not autofill the username and password.
<input type="text" name="newPassword" id="newPassword" value="" class="form-control" autocomplete="off">
<script type="text/javascript">
$(document).ready(function(){
$('#newPassword').attr('type', 'password');
});
</script>
The reason browsers are ignoring autocomplete=off is because there have been some web-sites that tried to disable auto-completing of passwords.
That is wrong; and in July 2014 Firefox was the last major browser to finally implement the change to ignore any web-site that tries to turn off autocompleting of passwords.
Bugzilla Bug 956906 - ignore autocomplete="off" when offering to save passwords via the password manager
Reddit discussion
Chrome's announcement when they began ignoring autocomplete=off
Any attempt by any web-site to circumvent the browser's preference is wrong, that is why browsers ignore it. There is no reason known why a web-site should try to disable saving of passwords.
Chrome ignores it
Safari ignores it
IE ignores it
Firefox ignores it
What if I'm a special snowflake?
There are people who bring up a good use-case:
I have a shared, public area, kiosk style computer. We don't want someone to (accidentally or intentionally) save their password so they next user could use it.
That does not violate the statement:
Any attempt by any web-site to circumvent the browser's preference is wrong
That is because in the case of a shared kiosk:
it is not the web-server that has the oddball policy
it is the client user-agent that has the oddball policy
The browser (the shared computer) is the one that has the requirement that it not try to save passwords.
The correct way to prevent the browser from saving passwords
is to configure the browser to not save passwords.
Since you have locked down and control this kiosk computer: you control the settings. That includes the option of saving passwords.
In Chrome and Internet Explorer, you configure those options using Group Policies (e.g. registry keys).
From the Chrome Policy List:
AutoFillEnabled
Enable AutoFill
Data type: Boolean (REG_DWORD)
Windows registry location: Software\Policies\Chromium\AutoFillEnabled
Description: Enables Chromium's AutoFill feature and allows users to auto complete web forms using previously stored information such as address or credit card information. If you disable this setting, AutoFill will be inaccessible to users. If you enable this setting or do not set a value, AutoFill will remain under the control of the user. This will allow them to configure AutoFill profiles and to switch AutoFill on or off at their own discretion.
Please pass the word up to corporate managers that trying to disable autocompleting of password is wrong. It is so wrong that browsers are intentionally ignoring anyone who tries to do it. Those people should stop doing the wrong thing.™
tl;dr: My browser is going to remember my login for your web-site. If you don't like it: that's your problem. I will not sacrifice my preferences for yours.
Put it another way
There is a lot of confusion, or disagreement, on these points. Let me clarify, and put it as plainly as i possibly can:
if i want to save my HIPPA password: that's my right
if i want to save my PCI password: that's my right
if i want to save the "new password for the user": that's my right
if i want to save the one-time-password: that's my right
if i want to save my "first color's favorite maiden" answer: that's my right.
It's not your job to over-rule the user's wishes. It's their browser; not yours.
And if i don't want the value saved, i will click Nope:
Neither you, nor your managers, nor HIPPA, nor the EU, nor the GDPR, get to over-rule my wishes. It's my browser. I'm the user. I'm in charge.
If you have a different opinion
on how your browser should behave
then you
can configure your browser
to suit your personal preferences
But you don't get to impose them on anyone else.
But it's a HIPPA-PCI-GDPR-PII violation if we allow passwords to be saved. We need auto-filling turned off!
No, you don't. I'm right. You're wrong. And every browser agrees with me. If you don't like something, i suggest you talk to a therapist about it.
Adding autocomplete="something" attributes does not help me.
My form has text type input and Chrome constantly filled it with login data.
Adding hidden text type input did not help too. But solution was adding pair hidden input fields with text and password types before visible inputs
<input type="text" style="width:0;height:0;visibility:hidden;position:absolute;left:0;top:0" />
<input type="password" style="width:0;height:0;visibility:hidden;position:absolute;left:0;top:0" />
Tested with Chrome Version 74
I ended up doing something like this:
<input type="password"
id="password-field"
onClick="yourFunction()"
class="form-control"/>
function yourFunction() {
var temporalValue = $('#password-field').val();
$('#password-field').val("");
$('#password-field').attr('type', 'text');
myAjaxRequestPromise(temporalValue).then(function(version) {
//more logic
}, function(errorResponse) {
// Just a hack to fool browsers and do not store my password
$('#password-field').val(temporalValue);
$('#password-field').attr('type', 'password');
// more logic
});
}
And always make sure the $('#password-field').val("") initializes the field without values, it could be whenever you show your modal or on the load page callback
It seems to be working fine for Safari/Chrome/Firefox
It basically switches between input types before doing the Ajax request to the server and in case there is an error we set back again the old value to the input.
I found the solution. !!!!
PROBLEM
my problem was that the username and password saved in the browser was automatically filling my register form
REASON
The problem here is that the password input type is password. it automatically fills in as username without knowing what the parent entry is.
SOLUTION
Adding autocomplete="new-password" to the password entry solved my problem.
It also works in Firefox and chrome. I haven't tested the others.
<input
id="txtSetPassword"
[formControlName]="formControlName"
[type]="show ? 'text' : 'password'"
class="input"
autocomplete="new-password"
[placeholder]="'loginPasswordForm.password.placeholder' | cxTranslate"
/>
In HTML 5 you can do it in one of two ways...
<form action="demo_form.asp" autocomplete="off">
Or an individual control
<input type="email" name="email" autocomplete="off">
For more info - http://www.w3schools.com/html/html5_form_attributes.asp
I created html form for registration, where user must fill password input.
Actually if "register" button is pressed, then i process form on the server side and i make redirect. Chrome still offering me if i want to save password on this site (probably because it knows that there is password input on tha form, which was submitted). I wanna dissalow this offer from browser when user is registering.
Try setting autocomplete="off" on your input:
<input type="password" name="password" autocomplete="off" />
https://developer.mozilla.org/en-US/docs/Mozilla/How_to_Turn_Off_Form_Autocompletion?redirectlocale=en-US&redirectslug=How_to_Turn_Off_Form_Autocompletion
Is it possible to use CSS to disable autocomplete on a form element (specifically a textfield)?
I use a tag library which does not permit the autocomplete element and I would like to disable autocomplete without using Javascript.
As it stands, there is no 'autocomplete off' attribute in CSS. However, html has an easy code for this:
<input type="text" id="foo" value="bar" autocomplete="off" />
If you're looking for a site-wide effector, an easy one would be to simply have a js function to run through all 'input' s and add this tag, or look for the corresponding css class / id.
The autocomplete attribute works fine in Chrome and Firefox (!), but see also Is there a W3C valid way to disable autocomplete in a HTML form?
You can use a generated id and name everytime, which is different, so the browser cannot remember this text-field and will fail to suggest some values.
This is at least the cross browser safe alternative, but I would recommend to go with the answer from RobertsonM (autocomplete="off").
you can easily implement by jQuery
$('input').attr('autocomplete','off');
If you're using a form you can disable all the autocompletes with,
<form id="Form1" runat="server" autocomplete="off">
CSS does not have this ability. You would need to use client-side scripting.
I tried all suggested ways from this question answers and other articles in the web but not working anyway. I tried autocomplete="new-random-value", autocomplete="off" in form element, using client-side script as below but outside of $(document).ready() as one of the user mentioned:
$(':input').on('focus', function () {
$(this).attr('autocomplete', 'off')
});
I found maybe another priority in the browser cause this weird behavior! So I searched more and finally, I read again carefully below lines from this good article:
For this reason, many modern browsers do not support
autocomplete="off" for login fields:
If a site sets autocomplete="off" for a , and the form includes
username and password input fields, then the browser will still offer
to remember this login, and if the user agrees, the browser will
autofill those fields the next time the user visits the page. If a
site sets autocomplete="off" for username and password fields,
then the browser will still offer to remember this login, and if the
user agrees, the browser will autofill those fields the next time the
user visits the page. This is the behavior in Firefox (since version
38), Google Chrome (since 34), and Internet Explorer (since version
11).
If you are defining a user management page where a user can specify a
new password for another person, and therefore you want to prevent
auto-filling of password fields, you can use
autocomplete="new-password"; however, support for this value has not been implemented on Firefox.
It's just worked. I tried in chrome specially and I hope this continues working and help others.
There are 3 ways to that, i mention them in order of being the better way...
1-HTML way:
<input type="text" autocomplete="off" />
2-Javascript way:
document.getElementById("input-id").getAttribute("autocomplete") = "off";
3-jQuery way:
$('input').attr('autocomplete','off');
I solved the problem by adding an fake autocomplete name for all inputs.
$("input").attr("autocomplete", "fake-name-disable-autofill");
I just use 'new-password' instead 'off' on autocomplete.
and I also have try using this code and works (at least on my end), I use WP and GravityForm for your information
$('input').attr('autocomplete','new-password');
Thanks to #ahhmarr's solution I was able to solve the same problem in my Angular+ui-router environment, which I'll share here for whoever's interested.
In my index.html I've added the following script:
<script type="text/javascript">
setTimeout(function() {
$('input').attr('autocomplete', 'off');
}, 2000);
</script>
Then to cover state changes, I've added the following in my root controller:
$rootScope.$on('$stateChangeStart', function() {
$timeout(function () {
$('input').attr('autocomplete', 'off');
}, 2000);
});
The timeouts are for the html to render before applying the jquery.
If you find a better solution please let me know.
You can't use CSS to disable autocomplete, but you can use HTML:
<input type="text" autocomplete="false" />
Technically you can replace false with any invalid value and it'll work. This iOS the only solution I've found which also works in Edge.