1

I'm trying to integrate Stripe check out. For that I'm following this documentation:

https://stripe.com/docs/recipes/subscription-signup#creating-the-signup-form-using-checkout

So I pasted that <script> tag inside my form, like:

<form action="/create_subscription.php" method="POST">
  <script
    src="https://checkout.stripe.com/checkout.js" class="stripe-button"
    data-key="pk_test_lrpNHu3jIKBoBo2ZLZ8dzzBh"
    data-image="images/marketplace.png"
    data-name="Emma's Farm CSA"
    data-description="Subscription for 1 weekly box"
    data-amount="2000"
    data-label="Sign Me Up!">
  </script>
</form>

The document says that when the user clicks on the Signup button it should open a pop up asking card details, but instead of that it directly submits the form.

I pretty sure that Stripe key has nothing to do with that, but still I have used the correct key. Also, there is no any Javascript error on the console.

I have almost searched everything on the internet, however still no luck.

PS: I'm on http and not https, not sure if that can be the issue.

EDIT:

I thought the issue was running on HTTP instead of HTTPS as it was mentioned here:

https://stripe.com/docs/checkout#does-checkout-require-https

But now I don't think that it could be the issue as it working fine here on HTTP:

http://demo.ilovephp.net/stripe/stripe_pay_checkout_demo.php

EDIT:

I found the issue: Laravel's default app.js is making issue with Stripe's checkout.js. without app.js it is working fine.

https://laracasts.com/discuss/channels/laravel/issue-with-stripe-api-js-and-laravel-js?page=1

Still I didn't get a good solution for that.

Thanks

Parth Vora
  • 4,073
  • 7
  • 36
  • 59
  • I already mentioned that in question. Anyway, I found the issue. Will post once I'm done. – Parth Vora Jul 23 '17 at 07:56
  • Your provided code has no issue. You can check this form in a new page for your test. It may be some other factor of your page which suppress Stripe popup. – Zico Jul 23 '17 at 07:57
  • Do you have more code than just this block your page? Can you share a link to the page in question or full code in a JSFiddle folks can look at. I suspect the issue sits beyond the Checkout block here. – duck Jul 23 '17 at 21:58
  • @duck, see the second edit in the question. – Parth Vora Jul 24 '17 at 04:47

1 Answers1

1

In the resources/views/layouts/app.blade.php just move the <script src="{{ asset('js/app.js') }}"></script> to the head of the page instead of it being at the end.

James Arnold
  • 698
  • 3
  • 9
  • 22