#Perry
mossy lichen
Why do you need to submit on another page?
tulip aspen
since that is the requirement of client
they have first page on which we have all the personal details and card elements component and then 2nd page is review page where you can review your form and then on that review page (2nd page) you have submit button
tulip aspen
i am unable to pass this elements to the next page component (review page), somehow the element gets empty value on review page
i don't know how, since i am saving elements (UseElements) on global state
mossy lichen
Is this a SPA?
Or some sort of server-side rendered app where the whole page redirects?
tulip aspen
server-side rendered app, and whole page get's redirected
we are using Next js for page routing
let me send you screenshot
for the object before and after
mossy lichen
Oh in that case you'll need to do something like this: https://stripe.com/docs/payments/build-a-two-step-confirmation
We also call this out in the guide you're following: https://stripe.com/docs/payments/accept-a-payment-deferred?platform=web&type=setup#create-pm
tulip aspen
ohh, let me check, in that as well we are calling elements i see
Also i am doing setupIntent and not paymentintent, should be possible for setupIntent too right? since we are not charging the customer right away
mossy lichen
Yep
Issue is if you're doing a redirect, the element won't be mounted anymore
So you need to change the flow a bit
tulip aspen
this is when i collect elements (useElements) details on 1st page where we have card elements, See _elements which has 3 array values
and now see this, when elements object is passed on to next page, it gives me empty value for _elements
tulip aspen
Issue is if you're doing a redirect, the element won't be mounted anymore
What do you suggest then? you are right element will not be mounted on next page 😦
mossy lichen
What do you suggest then? you are right element will not be mounted on next page...
I already made my suggestion
It's the two-step flow: https://stripe.com/docs/payments/accept-a-payment-deferred?platform=web&type=setup#create-pm
tulip aspen
i am already following this documentation, the problem is, in that as well again stripe.createPaymentMethod({...}) needs elements object
and i cannot send that elements to stripe API's unless i am on review page where the actual submit button is
mossy lichen
You create the payment method when you're on the same page
Then show the confirmation page
And when the customer confirms, that's when you use the setupintent
okay, this can be done
Issue is, on review page (2nd page) user can review their application and if change is needed they can revert back to 1st page. as we never save values, fields gets emptied on 1st page and user has to fill in card details again, which will create Payment method ID again
so this will result in creating Payment method ID again and again whenever user wants to edit their data
mossy lichen
There's no issue with that
They won't be attached to any customer since you're not creating the setupintent in that circumstance
tulip aspen
You are right, i can do that if there's no issue with creating multiple IDs
and how can i confirm setup? since that payment method ID needs to be used for future payments, which we are not responsible
do i need to confirm setup after setupintent is created? or it is not required at all?
mossy lichen
Yeah you'll need to confirm it
When creating pass the payment method id you created in the frontend here: https://stripe.com/docs/api/setup_intents/create#create_setup_intent-payment_method
Then once the customer agrees to the terms/confirms on your confirmation page, you can call confirmSetup on the frontend: https://stripe.com/docs/js/setup_intents/confirm_setup
And you can use the setupintent's client secret to do that: https://stripe.com/docs/api/setup_intents/object#setup_intent_object-client_secret
tulip aspen
ohh great, i was under impression that confirm setup can be done only via elements! this is great
and i can also pass the status of setup intent for 3DS verification of card right?
mossy lichen
What do you mean?
gilded zenithBOT
tulip aspen
i meant i need to also verify card if 3DS verification is required or not
so that shall be possible with "status": see the attached Screenshot
mossy lichen
Oh that should happen automatically:
When called, stripe.confirmSetup will attempt to complete any required actions, such as authenticating your user by displaying a 3DS dialog or redirecting them to a bank authorization page. Your user will be redirected to the return_url you pass once the authorization is complete.