red_api | Stripe Developers | Page 1

civic boneBOT Oct 31, 2025, 12:25 AM

#

👋 Welcome to your new thread!

⏲️ We'll be here soon! Typically we respond in a few minutes, but sometimes we might take a bit longer if the server is busy or if you have a particularly tricky question.

⏱️ We close idle threads, which makes them read-only. Once a thread is closed it won't be reopened, but you can always start a new thread if you have another question.

🔗 This thread will always be available, even after it's closed. You can find it again using Discord's search, or you can save this link: https://discord.com/channels/841573134531821608/1433612800344723526

📝 Have more to share? Add more details, code, screenshots, videos, etc. below.

Below are links to other discussions we've had with you in the past week in case you want to review that information. If your question is related to one of these previous discussions, please provide a comprehensive summary of the current state and what you need help with now. We help many users simultaneously, so a summary allows us to resolve your issue as soon as possible.

red_api, 1 day ago, 113 messages
red_payment-element-load-event, 3 days ago, 48 messages
red_api, 3 days ago, 26 messages

#

quartz skiff Oct 31, 2025, 12:26 AM

#

we have changed the underlying methods we use, as we were added to surcharge beta which won't allow confirmation token etc..

#

but I can't figure out where to specify the payment methods to display as choices

#

we now do this:

        mode: 'payment',
        amount: propsData.amount,
        currency: 'usd',
        loader: 'always',
        paymentMethodCreation: 'manual'
        // Fully customizable with appearance API.
        //appearance: {/*...*/},
      };

      // Set up Stripe.js and Elements to use in checkout form
      elements = stripe.elements(options);

      // Create and mount the Payment Element
      const paymentElementOptions = { layout: 'tabs'};
      const paymentElement = elements.create('payment', paymentElementOptions);

      paymentElement.on('change', paymentChanged);
      paymentElement.on('ready', paymentElementReady);

      var targetElementId = "topDiv";
      paymentElement.mount("#payment-element"); ```

#

I thought this would just pull from the payment methods configured in our dashboard - but doesn't seem to?

#

I have applePay enabled in sandbox, but it doesn't show up

#

I need to add a custom payment method that I just created, to display above

heady knot Oct 31, 2025, 12:49 AM

#

Hey! Just to understand your question

#

Is it that ApplePay is not showing up?

quartz skiff Oct 31, 2025, 12:53 AM

#

yes

#

and then to confirm that the way I have set it up, it just pulls from the enabled payment methods in my dashboard, correct?

#

and lastly, if have added a custom payment method - how do I handle processing of that when they click submit?

heady knot Oct 31, 2025, 1:00 AM

#

Could you send me the site where your PaymentElement is showing?

#

Do provide steps on how i can access the page e.g. login credentials to reach the page

#

And can you send me your account ID (acct_xxx) to check the payment configurations on the account?

quartz skiff Oct 31, 2025, 1:04 AM

#

sure - but it's a bit hard to get to (lots of data to fill in)

#

https://temp.thehibiscusraleigh.com/weekdays-daytime-2026

#

where do I find account ID?

#

I removed ApplePay and CashApp, and added my customer payment processor - shows up perfectly now

#

what does Stripe expect me to do to process it - just catch this and do something?

#

Stripe does not support processing the selected custom payment method cpmt_1SO5tOBBPymgN3PsWz2sn7vg. Make sure you're handling the custom payment method individually.

#

how do I check on Submit that the method selected is the custom one?

quartz skiff Oct 31, 2025, 1:25 AM

#

I thought this would give me it, but it's undefined???

    const {submitError, result} = await elements.submit();
    if (submitError) {
      console.error("submitError! " + JSON.stringify(submitError));
      handleError(submitError);
      return;
    }

    console.log("result from elements.submit(): " + JSON.stringify(result));```

heady knot Oct 31, 2025, 1:26 AM

#

quartz skiff I removed ApplePay and CashApp, and added my customer payment processor - shows ...

wait so, is your question still about applepay showing?

quartz skiff Oct 31, 2025, 1:26 AM

#

I moved past that

heady knot Oct 31, 2025, 1:26 AM

#

or how to find out the payment method being used

quartz skiff Oct 31, 2025, 1:26 AM

#

more concerned about handling the custom payment method

heady knot Oct 31, 2025, 1:26 AM

#

what is the expected behaviour of the paymentElement?

#

What do you mean by handling the custom payment method?

quartz skiff Oct 31, 2025, 1:26 AM

#

do so, I need to figure out that's what payment method they chose - how do I do that?

heady knot Oct 31, 2025, 1:27 AM

#

I see

#

Give me some time to find the docs for that!

quartz skiff Oct 31, 2025, 1:27 AM

#

thanks

#

I need to run though - I believe the code I just posted above should show me that?

heady knot Oct 31, 2025, 1:29 AM

#

If this method succeeds, the result object contains the selected payment method type in the selectedPaymentMethod field. If this method fails, the result object contains a localized error message in the error.message field.

#

yeah it seems to be the case from the docs

quartz skiff Oct 31, 2025, 1:31 AM

#

let me try it with non-custom method and see what it returns

#

result from elements.submit(): undefined

#

same thing

#

any ideas?

heady knot Oct 31, 2025, 1:50 AM

#

you can use the onchange handler: https://docs.stripe.com/js/element/events/on_change?type=paymentElement#element_on_change-event

quartz skiff Oct 31, 2025, 1:50 AM

#

I could, but then I would need to set and check it on submission

#

any ideas why the recommended way is not working?

heady knot Oct 31, 2025, 1:55 AM

#

elements.submit() is only when creating the Elements object without an Intent.

as seen here: https://docs.stripe.com/js/elements/submit

heady knot Oct 31, 2025, 1:55 AM

#

quartz skiff I could, but then I would need to set and check it on submission

but would the latest on change event show the payment method used?

quartz skiff Oct 31, 2025, 1:57 AM

#

I'm not using Intent

heady knot Oct 31, 2025, 2:03 AM

#

Call await elements.submit() to trigger form validation and collect any data required for wallets.
The submit handler is for wallets, i dont think it applies for custompaymentmethods

https://docs.stripe.com/payments/payment-element/migration?integration-path=one-time#one-time-update-method

quartz skiff Oct 31, 2025, 2:04 AM

#

it works for cards, but doesn't return anything

#

    console.log("about to submit elements");

    // Trigger form validation and wallet collection
    const {submitError, result} = await elements.submit();
    if (submitError) {
      console.error("submitError! " + JSON.stringify(submitError));
      handleError(submitError);
      return;
    }

    console.log("result from elements.submit(): " + JSON.stringify(result));

    name = propsData.contact.name;


    console.log("about to createPaymentMethod");

    // Create the PaymentMethod using the details collected by the Payment Element
    const {error, paymentMethod} = await stripe.createPaymentMethod({
      elements,
      params: {
        billing_details: {
          name: name
        }
      }
    });

#

it all works fine

#

but at least for card, submit should return the result?

heady knot Oct 31, 2025, 2:05 AM

#

What do you mean by

it works for cards, but doesn't return anything

quartz skiff Oct 31, 2025, 2:06 AM

#

the flow works - the payment is successful

#

but SON.stringify(result)); spits out "undefined"

heady knot Oct 31, 2025, 2:07 AM

#

wait

#

but our docs shows this

#

// Trigger form validation and wallet collection
const {error: submitError} = await elements.submit();
if (submitError) {
handleError(submitError);
return;
}

#

https://docs.stripe.com/payments/payment-element/migration?integration-path=one-time#one-time-update-method

quartz skiff Oct 31, 2025, 2:08 AM

#

sure, but it's not checking the result

#

https://docs.stripe.com/js/elements/submit

Stripe JS Reference

#

This method returns a Promise which resolves with a result object. If this method succeeds, the result object contains the selected payment method type in the selectedPaymentMethod field. If this method fails, the result object contains a localized error message in the error.message field.

heady knot Oct 31, 2025, 2:09 AM

#

but if the result is empty, doesn't that mean that there is no validation error

quartz skiff Oct 31, 2025, 2:09 AM

#

If this method succeeds, the result object contains the selected payment method type in the selectedPaymentMethod field

#

ie no error

heady knot Oct 31, 2025, 2:10 AM

#

And it's for wallets

quartz skiff Oct 31, 2025, 2:10 AM

#

?

heady knot Oct 31, 2025, 2:10 AM

#

give me a moment to test something out

quartz skiff Oct 31, 2025, 2:10 AM

#

this is just elements in JS?

#

ok

#

huh, this works:

#

    console.log("result: " + JSON.stringify(result));
    
    if (result.error) {
      // Handle errors here
      console.error("Submission error:", result.error.message);
      // Display error message to the user
    } else {
      // Submission successful
      console.log("Submission successful!");
      console.log("Selected payment method:", result.selectedPaymentMethod);
      // Proceed with further actions, like confirming payment or processing data
    }```

#

"Selected payment method: cpmt_1SO5tOBBPymgN3PsWz2sn7vg"

heady knot Oct 31, 2025, 2:26 AM

#

hmm, am experiencing the same thing on my end as well

#

seems like when this is done

const {submitError, result} = await elements.submit();

#

Its trying to destructure the result fields: submitError and result

#

but result is not even a field to be destructured from the response of await elements.submit();

heady knot Oct 31, 2025, 2:27 AM

#

quartz skiff ``` const result = await elements.submit(); console.log("result: " + JSON...

i guess you manage to find out the solution then!

quartz skiff Oct 31, 2025, 2:36 AM

#

Yes, I guess there’s something in that format that doesn’t work

heady knot Oct 31, 2025, 3:19 AM

#

Do let me know if you have further questions!

#

If not i will be closing this thread!

quartz skiff Oct 31, 2025, 3:21 AM

#

thanks!

#

yes - for the custom payment method, how do I change the description shown in the UI:

"After submission, you’ll be guided through completing next steps with xxx"

heady knot Oct 31, 2025, 3:24 AM

#

Could you provide me a screenshot of how that text looks like on your site?

#

Ah i see you are talking about this

#

You can display custom embedded content

https://docs.stripe.com/payments/payment-element/custom-payment-methods#embedded-custom-content

#red_api