Prevent chrome from autofilling creditcard info

Question

I have a <input type="text" name="quantity" /> on my checkout form, and somehow Chrome thinks that this field is a credit card expiration month.

Once a user starts typing in his name (into another field), Chrome offers to fill in the CC info but when the user clicks on it, Chrome fills my quantity -<input> with the expiration date.

I've tried every possible workaround including:

autocomplete="off" (doesn't work in Chrome completely)
setting the autocomplete="new-password" (doesn't work for CC-autocomplete)

PS. if you're considering marking this question as "duplicate" please note that I specifically talk about credit-card autocomplete, not your usual autofill.

Possible duplicate of [Disable autofill on a web form through HTML or JavaScript?](http://stackoverflow.com/questions/15074985/disable-autofill-on-a-web-form-through-html-or-javascript) — jeremykenedy, Oct 08 '16 at 22:27
@developernator like I indicated in the question, it's not a usual autocomplete, it's a "saved credit card" autocomplete. — jazzcat, Oct 08 '16 at 22:33
Did you ever find a solution for this? I just run into this exact same issue. And for anyone else ending up here, autocomplete="off" doesn't work. — Anders Bergquist, Oct 26 '18 at 12:14
Any update on this, I'm trying to fix this too, but not working for me! :( — jayM, Mar 25 '20 at 18:28
@jazzcat, I'm having the same problem. Using autocomplete="anything" doesn't work. Did you solve it? How? — Damián Pablo González, Jul 22 '21 at 17:35

score 1 · Answer 1 · answered Nov 14 '16 at 14:55

1

Add autocomplete="nope", to your input tag if you don't want it to auto-populate with anything. The browser will try to process it and since nope is not an acceptable option for it the browser will give up on processing it.

See - https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion#Disabling_autocompletion.

answered Nov 14 '16 at 14:55

jforeker

35
3

4

That's hilarious. – Feathercrown Nov 14 '16 at 14:57

score 0 · Answer 2 · answered Apr 16 '21 at 13:23

The only solution I found that is actually working with chrome 89.0.4xxxx

<input style="display: none;" autocomplete="cc-csc"/>

How is this solution intended to work: Basically, we give an alternative for chromium browsers to match by a specific autocomplete key (cc-csc) and not one that is more generic (number) by name or other secondary looked-up data.

You can find details on the topic here

Here you can find a fixed example, comment out line with the fix to compare: https://jsfiddle.net/bogdanm/sj0ewfqv/7/

score 0 · Answer 3 · answered Mar 04 '22 at 09:02

0

Adding this to the form seems to work for me.

<input style="display: none;" autocomplete="cc-exp-month"/>
<input style="display: none;" autocomplete="cc-exp-year"/>

These fields have no effect but attracts the unwanted attention of the browser.

answered Mar 04 '22 at 09:02

Marco Pessotto

1

score -2 · Answer 4 · answered Dec 04 '20 at 13:32

I know this question has already been answered, but I'm going to put my two cents in anyway.

Another way to do this(as far as I know), is when making the <input> fields in your HTML document, just don't add the type="ipsum dolor amet" argument. Then Chrome, or any other browser, won't know what's what and will stay out of it.

Prevent chrome from autofilling creditcard info

4 Answers4

Linked