mirajacc-payment-element-react | Stripe Developers | Page 1

gritty hazel Aug 25, 2022, 4:39 AM

#

By empty field do you mean when customer push the submit button, there is some fields left unfilled?

winter night Aug 25, 2022, 4:40 AM

#

Yes. I have a few API calls added before confirmPayment() so I need to check if the user has completed the form to make those API calls.

gritty hazel Aug 25, 2022, 4:43 AM

#

Maybe this change event would help? https://stripe.com/docs/js/element/events/on_change?type=paymentElement

Stripe JS Reference

winter night Aug 25, 2022, 4:46 AM

#

I had a look at it before. Tried, but couldn't make it work in the React application, so reached out here.

gritty hazel Aug 25, 2022, 4:50 AM

#

I am not super familiar but why is it not working in a Reaction application?

winter night Aug 25, 2022, 4:53 AM

#

Because the implementation is different in react application compared to regular JS app. https://stripe.com/docs/stripe-js/react

React Stripe.js reference

React components for Stripe.js and Stripe Elements

gritty hazel Aug 25, 2022, 4:57 AM

#

ah I see, because you don't have access to paymentElement

winter night Aug 25, 2022, 5:00 AM

#

Correct. And I'm trying to see if I can use useElements(). Compared console logs for both success and error cases, no distinct field to check if any field is empty.

quartz whale Aug 25, 2022, 5:13 AM

#

stepping in on behalf of orakaro. Can you give an example of a field which you're validating that it's not empty?

winter night Aug 25, 2022, 5:16 AM

#

Thanks Alex. The fields are credit card number, expiry and cvc.

quartz whale Aug 25, 2022, 5:20 AM

#

the payment element is already performing those validations though, why do you want to validate it too?

winter night Aug 25, 2022, 5:23 AM

#

I have a few APIs that I need to call before the payment is made. These should be called after the pay button is clicked and before the confirmPayment() is called. This is where I need the check and handle API calls accordingly.

#

This is basically for inventory lock and order placement. We don't want the payment to be made before the inventory check or order placement.

quartz whale Aug 25, 2022, 5:27 AM

#

If you want to perform inventory lock and order placement, then I think for your use case, perhaps a better way to go about it is to use Authorize and Capture instead - https://stripe.com/docs/payments/place-a-hold-on-a-payment-method

#

or alternatively save the card and then charge it later after performing inventory lock and order placement : https://stripe.com/docs/payments/save-and-reuse

#mirajacc-payment-element-react