payment icon indicating copy to clipboard operation
payment copied to clipboard

iOS class="cc-number"

Open jack-guide opened this issue 3 years ago • 18 comments

20210621_145225000_iOS

i am using version 2.4.4 of your library.

the form has the novalidate

the page will not move away from focus of the credit card number on iOS 14.6

Have i missed something in the documentation?

jack-guide avatar Jun 21 '21 14:06 jack-guide

Not that I am aware of but don't you have to hit "Done" link on the keyboard numeric input in IOS to close it and move on?

melloware avatar Jun 21 '21 15:06 melloware

when i hit "done", the keyboard disappears but the card number is still highlighted in yellow and when i try to click a different field, it just brings me back to the card number

jack-guide avatar Jun 21 '21 15:06 jack-guide

Let me see if I can reproduce it.

melloware avatar Jun 21 '21 15:06 melloware

When I try it here on my iPhone it works...

https://www.primefaces.org/showcase-ext/sections/creditcard/basicUsage.jsf

melloware avatar Jun 21 '21 15:06 melloware

the way it works on that links is different from the documentation

on the input box for the card number I have class="cc-number". this seems to be what is causing the problem

jack-guide avatar Jun 21 '21 15:06 jack-guide

<input name="ctl00$ContentPlaceHolder1$tbPPCardNumber" type="text" id="tbPPCardNumber" class="four columns cc-number unknown" inputmode="numeric" x-autocompletetype="cc-number">

jack-guide avatar Jun 21 '21 15:06 jack-guide

ahh yeah i am mapping it differently there.

melloware avatar Jun 21 '21 16:06 melloware

I'm having the same problem in Safari on desktop and mobile. Can't tab or click away from the credit card number input field after calling formatCardNumber(input)

This began after updating from 2.4.3 to 2.4.4

davidmerrique avatar Jun 21 '21 16:06 davidmerrique

The only real change was this one...

https://github.com/jessepollak/payment/issues/155

melloware avatar Jun 21 '21 16:06 melloware

@melloware I'm wondering if it's this line that's causing the problem

https://github.com/jessepollak/payment/compare/v2.4.3...2.4.4#diff-eb104090800eb03c1ec3715392f75ea5d853e3c0252a204f165c0638c09e4e7dR735

When 'blur' happens, reFormatCardNumber is causing the field to focus again.

davidmerrique avatar Jun 21 '21 16:06 davidmerrique

That is definitely the problem. I would stay on 2.4.3 for now.

melloware avatar Jun 21 '21 17:06 melloware

I wonder if instead of reformatCardNumber i just do..

QJ.on el, 'blur', formatCardNumber(maxLength)

melloware avatar Jun 21 '21 19:06 melloware

this seems to work on iOS and on Chrome on desktop

QJ.on(el, 'keyup', reFormatCardNumber);

jack-guide avatar Jun 22 '21 07:06 jack-guide

Can you please review my PR?

melloware avatar Aug 12 '21 11:08 melloware

@melloware Are U talk with me ? I 'am a noob in gayhub. sorry bro.

XiangBo-EvanZuo avatar Aug 14 '21 04:08 XiangBo-EvanZuo

My issue is in Card Number Can't Be Blur In IOS When Input Card Numbers jessepollak/card#527

XiangBo-EvanZuo avatar Aug 14 '21 04:08 XiangBo-EvanZuo

OK I just deployed Payment 2.4.5 to NPM https://www.npmjs.com/package/payment

Can you try again?

melloware avatar Aug 14 '21 11:08 melloware

@jessepollak it looks like all PR's are being blocked because the build is no longer running. Can you disable that check so I can merge PR's?

melloware avatar Aug 14 '21 12:08 melloware