Server action running in browser on form submit

Wappler General
#1

Hope this is just me having a bad day.

I have started working on Stripe checkout.
I think i have it all worked out in my head now
HOWEVER right at the start I have hit a problem calling a server action from the checkout
I am using the stripe simple checkout code initially

<form id="form1" action="your-server-side-code" method="POST">
  <script
    src="https://checkout.stripe.com/checkout.js" class="stripe-button"
    data-key="pk_test_xxxxxxxxxxxxxxxxxxxxxxx"
    data-amount="999"
    data-name="Hyperbytes Ltd"
    data-description="Widget"
    data-image="https://stripe.com/img/documentation/checkout/marketplace.png"
    data-locale="auto"
    data-currency="gbp">
  </script>
</form>

This is amended to be a server connect form by change to the form type with

<form id="form1" method="post" is="dmx-serverconnect-form" action="../dmxConnect/api/stripe/send_charge.php">

Basically I call a server action from a server connect form and am getting the JSON output of the action displaying in the browser on submission

image
image.png722×181 6.31 KB

Sure i will have missed something obvious but after hours of trying to see the wood for the trees thought i would seek help

Video attached stripeproblem.mp4 (5.5 MB)

Link

Test card number 4242 4242 4242 4242 (any dates and CSV works)

#2

The problem is that Stripe overrides the submit of the form, the ajax submit isn’t working. It seems that the form was successful submitted, you could do a redirect at the end of the action.

Maybe a better way is to use the Stripe Elements, it allows you to intergrade the form elements better with your own design and it is just as secure.

1 Like
#3

Hello,

I am having the same issue you had before. Did you find a way to solve the problem with the submit form?

Thank you