#ace-cardelement-split
teal beacon
@scenic forge you can handle this yourself by checking if they are complete or not and only submit once they are
ace-cardelement-split
scenic forge
<@406935460741382166> you can handle this yourself by checking if they are compl...
But the only way I can check to see if they're complete (that I'm aware of) is when a change event fires. What if a user never changes anything in the fields? Is there another way of determining the status of these elements?
teal beacon
they are empty by default
like they can't be pre-filled so you know they are incomplete until they are complete
scenic forge
Okay, so if no change event has occurred for that field then I should assume that they're invalid/empty?
If so, that seems to put a lot of set-up burden on the end-user (me :D). It means that I'll have to set up some way of checking state for the fields in advance and then updating that state as the user updates the fields based on the change events.
teal beacon
Technically you don't have to do any of this though. If you call submit and the fields aren't ready we will already error for you
scenic forge
Okay. But I'm saying that I'm already trying to do this and I'm not getting any errors back.
teal beacon
an you share the exact code you're using? Do you have a page where I can reproduce this issue?
clear hollyBOT
scenic forge
I don't have a public page where you can reproduce the issue. Let me see if I can explain the setup cos it's not too complex. I have a form that contains a CardNumberElement, CardExpiryElement, and a CardCvcElement. The form is in its own component and it is wrapped in an Elements tag in the parent component. In the component that contains the form I have the submit button call a method which calls elements?.submit().then((result) => { console.log('result: ', result.error)}); on click (in the same component I am setting const elements = useElements().
When I click the submit button I expect to see errors in the console b/c the form fields are empty. But instead I get undefined.
deep willow
👋 stepping in here
Catching up
Hmm okay yeah I think there is a bit of confusion as elements.submit() is used for a completely different flow. Not with split elements.
That method is only used in our deferred-intent flow (https://stripe.com/docs/payments/accept-a-payment-deferred)
So are you trying to confirm a PaymentIntent here? Or what are you trying to do?
scenic forge
I am using the older API, not the Payment Intents one. Not my decision.
So what I'm trying to do is to get a token which I can save.
Does that make sense?
deep willow
Okay yeah so overall definitely don't recommend using that legacy API. But if you do then you want to use stripe.createToken (https://stripe.com/docs/js/tokens_sources/create_token?type=cardElement)
When you call that then it will error if the form is not complete
scenic forge
But in order to do that I need to use the Card Element?
deep willow
Nope
scenic forge
Okay, it looks like I can use the CardNumberElement. Is there any value in including
deep willow
You can pass any of the split elements into that
And then it will grab all that are rendered on the page
Doesn't actually matter which you pass to createToken
deep willow
Sure thing
scenic forge
Ah, but will I get back error messages if any of the other fields are empty?
deep willow
You should
scenic forge
Or invalid?
deep willow
I actually don't recall as I haven't used this legacy integration in a long time...
scenic forge
Okay. I will give that a try. Thanks to you both!
deep willow
Happy to help!
scenic forge
Yeah, like I said, not my decision about the legacy integration...
TY again.
Do I need to do something to close this thread, like #close?
deep willow
Nope I'll handle it 🙂