Chrome credit card autofill not being triggered Chrome credit card autofill not being triggered google-chrome google-chrome

Chrome credit card autofill not being triggered


It will work if you add following attributes to respective input elements:

  • autocomplete="cc-number"
  • autocomplete="cc-exp"
  • autocomplete="cc-csc"

Also I noticed that Chrome will not autocomplete if one of the cc fields is missing.

You can play around here - https://jsfiddle.net/q4gz33dg/2/


Name your expiration fields card_expiry_month and card_expiry_year. I'm not sure why your current names don't trigger the regex, but changing the names seems to work.

http://jsfiddle.net/7b6xtns7/ (it's a bit messy since it's not rendered)

Edit:Looks like ordering has to do with it too. If that doesn't work try putting the month/date immediately after the number entry field

http://jsfiddle.net/c86Lmo0L/


The accepted answer is great, thought I'd just chime in with some documentation and a note regarding React (tagged for this question)..

React requires you to pass the attribute as autoComplete="cc-number" (note camelCase), otherwise it will default to autocomplete="off".

More info: