search

stripe / react-stripe-js

React components for Stripe.js and Stripe Elements
https://stripe.com/docs/stripe-js/react
MIT License
1.75k stars 267 forks source link

[BUG]: Collect full billing address on a single page checkout #468

Closed wesleyyee closed 8 months ago

wesleyyee commented 8 months ago

What happened?

When using the PaymentElement (specifically a credit card), The billing information only includes country and postal_code. We need to collect full billing address. We've also tried to use an additional AddressElement in billing mode. But the API only allows a single AddressElement. I can't find another way to collect the full billing address on a single page checkout. Any way forward would be greatly appreciated!

Environment

No response

Reproduction

No response

SwapnilSonker commented 8 months ago

hey @wesleyyee assign it to me, I would like to give it a try and I will be grateful if you provide me with more information on this issure.

brendanm-stripe commented 8 months ago

Hey @wesleyyee -- your question asked about a full Billing address with Address Element is well suited for, but this comment suggests there are more constraints on your integration:

But the API only allows a single AddressElement. I infer from this that you're already using an Address Element to collect a shipping address, then? It's true that currently you can have only a single Address Element, though we are exploring options to make this more flexible.

For now, you can include both billing and shipping AEs by using an addition Elements group (via <Elements /> provider), like this example: https://codesandbox.io/p/sandbox/react-stripe-js-forked-5ky78z?file=%2Fsrc%2Findex.js%3A38%2C51

react-ae