Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

iOS class="cc-number" #161

Open
jack-guide opened this issue Jun 21, 2021 · 18 comments · May be fixed by #167 or Stretchy-93/card#2
Open

iOS class="cc-number" #161

jack-guide opened this issue Jun 21, 2021 · 18 comments · May be fixed by #167 or Stretchy-93/card#2
Assignees
Labels
Milestone

Comments

@jack-guide
Copy link

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?

@melloware
Copy link
Collaborator

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 melloware added the bug label Jun 21, 2021
@jack-guide
Copy link
Author

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

@melloware
Copy link
Collaborator

Let me see if I can reproduce it.

@melloware
Copy link
Collaborator

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

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

@jack-guide
Copy link
Author

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
Copy link
Author

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

@melloware
Copy link
Collaborator

ahh yeah i am mapping it differently there.

@davidmerrique
Copy link
Contributor

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

@melloware
Copy link
Collaborator

The only real change was this one...

#155

@davidmerrique
Copy link
Contributor

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

v2.4.3...2.4.4#diff-eb104090800eb03c1ec3715392f75ea5d853e3c0252a204f165c0638c09e4e7dR735

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

@melloware
Copy link
Collaborator

melloware commented Jun 21, 2021

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

@melloware
Copy link
Collaborator

I wonder if instead of reformatCardNumber i just do..

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

@jack-guide
Copy link
Author

this seems to work on iOS and on Chrome on desktop

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

@melloware
Copy link
Collaborator

Can you please review my PR?

@XiangBo-EvanZuo
Copy link

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

@XiangBo-EvanZuo
Copy link

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

@melloware
Copy link
Collaborator

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

Can you try again?

@melloware
Copy link
Collaborator

@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 melloware modified the milestones: 2.4.5, 2.4.7 Aug 5, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
4 participants