Search code examples
javascriptstripe-paymentspayment

How Do I get the Method from a Stripe.JS payment Element


Seems this is lost in the docs, but I do not want to set payment methods for Stripe. Instead, I would like to use the payment element and get back the payment method the customer chose.

I am creating it like this:

  if(cardElement.value !== null) {
      stripe = await loadStripe(process.env.MIX_STRIPE_KEY)
      elements = stripe.elements({clientSecret: paymentIntent.value.client_secret});
      paymentElement = elements.create('payment', {
        classes: {
          base: 'p-4 bg-slate-50 border-gray-300 focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 rounded-md shadow-sm'
        }
      })
      paymentElement.mount('#card-element')

And I am retrieving it like using elements.getElement('payment'). Seems to work fine, but now I would like to create a payment and for that, I would like to know whether it is a card, sepa, or whatever payment, because I need that futher down the line in the payment process and I do not want to hard-code cards. Any ideas?


Solution

  • If you want to know which Payment Method type/tab has been selected on the PaymentElement you can listen for the change event (see https://stripe.com/docs/js/element/events/on_change?type=paymentElement). When you receive the event, the value object will say the currently selected Payment method type.