bonnyy08

[opaque monolith]

Hi 👋

Can you share which example code you are referring to? That button element isn't a custom Stripe element AFAIK but I want to make sure we are talking about the same thing.

[deft nymph]

    <form id="payment-form" method="post" data-secret="{{ client_secret }}" style="margin:1rem 1rem;">
        <div id="payment-element">

        </div>
        <div id="error-message">
            <!-- Display error message to your customers here -->
        </div>
        <button id="submit">Pay</button>

    </form>```

its a part of the the form

Im adding my own input fields for things such as name, and phonenumber

and id like to know if i can handle those values with the 'pay' button

[opaque monolith]

Okay yeah in that example you still write the JavaScript code that handles the button click event yourself (even though we provide example code).

So it's entirely up to you

[deft nymph]

so the JavaScript that i attach to this button wont effect stripes functionality?

just for clarification

[opaque monolith]

You would still need to call the Stripe function as a result. e.g. stripe.confirmPayment(). But you could add additional actions here if you wanted.

As long as the code we show here is still present that should be fine: https://stripe.com/docs/payments/accept-a-payment?platform=web&ui=elements#web-submit-payment

[deft nymph]

alright thank you!

[opaque monolith]

Happy to help 🙂

[deft nymph]

im sorry to ask again, so i want to send the values of the name input to my backend. which cant happen with the event.preventDefault() do you know if i can remove that line or if there is any way around that?

[opaque monolith]

You absolutely can do this with event.preventDefault(). You would just make an additional JavaScript call to send the data to your back-end.

e.g.

const success = await fetch('/to-backend', {method: "POST", body: {name: input.value}});

This is just pseudocode though so don't take the syntax seriously

[deft nymph]

oh, alright, thank you!