StevenS | Stripe Developers | Page 1

gritty bloomBOT Dec 20, 2022, 10:22 AM

#

sterile thorn Dec 20, 2022, 10:26 AM

#

Hi! Let me help you with this.

gentle ferry Dec 20, 2022, 10:26 AM

#

Hi

#

thanks

sterile thorn Dec 20, 2022, 10:29 AM

#

You can use Payment Element to collect the payment method: https://stripe.com/docs/payments/accept-a-payment?platform=web&ui=elements

#

You can list the payment method types when you create the Payment Intent

#

Apple Pay and Google Pay are the same as 'card' payment method.
If these requirements are met, you will see it: https://stripe.com/docs/stripe-js/elements/payment-request-button?client=html#html-js-prerequisites

#

You can use this to collect address info: https://stripe.com/docs/elements/address-element

gentle ferry Dec 20, 2022, 10:32 AM

#

They payment element doesnt work well with the new shipping address element. For example you can't click on google pay because it fires the validation for the shipping address element.

#

It would be strange to expect the customer to enter the shipping address details to be able to click on google pay which already has the shipping address details.

#

That's why i was looking at this approach, separate wallet section with another credit card section with the address element.

sterile thorn Dec 20, 2022, 10:51 AM

#

You can also build an address field yourself, and only add it to the .confirmPayment() if needed.

gentle ferry Dec 20, 2022, 10:54 AM

#

I suppose I could add the address fields, try and style them the same as Stripe's fields, add the validation etc. Ok so what about my scenario is it possible to have two sections, wallet section and credit card section. The cc section with the shipping address element.

#

Thinking of using the wallet element AND the card element on the same page, is that possible?

sterile thorn Dec 20, 2022, 11:02 AM

#

You should be able to have 2 Element groups on the same page

#

The wallets section can be implemented with Payment Request Button: https://stripe.com/docs/stripe-js/elements/payment-request-button

gentle ferry Dec 20, 2022, 11:08 AM

#

ok good, do you know if the card element works with the address element?

sterile thorn Dec 20, 2022, 11:12 AM

#

Yes, you can collect the address values and use it where you need: https://stripe.com/docs/elements/address-element/collect-addresses?platform=web#web-retrieve-address

#

You can also disable validation: https://stripe.com/docs/elements/address-element/collect-addresses?platform=web#web-validate-address-details

gentle ferry Dec 20, 2022, 11:15 AM

#

ok great Vanya, will proceed with the payment request button, along with the card element plus the address element.

#

thank you for your help.

sterile thorn Dec 20, 2022, 11:21 AM

#

Happy to help. Let me know if you have any other questions.

#StevenS