LoveAndHappiness LoveAndHappiness - 1 month ago 10
PHP Question

Custom Stripe Button does not trigger the POST method

I am currently implementing Stripe and have some problems with it.

The simple integration works perfectly fine, this one:

<form action="step4" method="POST">
<script
src="https://checkout.stripe.com/checkout.js" class="stripe-button"
data-key="pk_test_mA3Wo4wGNDNEQ5rRHaUKTVOZ"
data-image="/img/documentation/checkout/marketplace.png"
data-name="Demo Site"
data-description="2 widgets"
data-currency="eur"
data-amount="2000">
</script>
</form>


But when I want to use the custom integration from here the specified method does not get called.

Currently I am just using a closure on my POST method, which dies and dumps the Input. In the simple integration I get the token back. In the custom integration I don't. Here is the closure (Laravel 5):

Route::post('step4', function() {
dd(Input::all());
});


And here is my code for the custom integration:

<form action="step4" method="POST">
<button id="stripeButton" class="btn btn-lg btn-block btn-primary">Pay with Stripe</button>
</form>

<script src="https://checkout.stripe.com/checkout.js"></script>

<script>
var handler = StripeCheckout.configure({
key: "{{$stripe_public_key}}",
image: "{{$data_image}}",
token: function(token) {
// Use the token to create the charge with a server-side script.
// You can access the token ID with `token.id`
}
});

$('#stripeButton').on('click', function(e) {
// Open Checkout with further options
handler.open({
name: "{{$data_name}}",
description: "{{$data_description}}",
currency: "USD",
amount: "{{$data_amount}}",
@if(Session::has('email'))
email: "{{$email}}",
@endif
allowRememberMe: false,
});
e.preventDefault();
});

// Close Checkout on page navigation
$(window).on('popstate', function() {
handler.close();
});
</script>


Yet the method doesn't seem to be called, since I don't get the die&dump of the Input. I don't get an error message, it just seems like a the stripe token is returned, without calling the method.

How do I call the method in the custom stripe integration?

Answer

The answer is, that my handler needed to append the following input forms:

        var handler = StripeCheckout.configure({
            key: "{{$stripe_public_key}}",
            image: "{{$data_image}}",
            // to this when a token is generated
            token: function(token) {
                // Use the token to create the charge with a server-side script.
                // You can access the token ID with `token.id`
                $form.append($('<input type="hidden" name="stripeToken" />').val(token.id));
                $form.append($('<input type="hidden" name="stripeEmail" />').val(token.email));

                // submit the form, uncomment to make this happen
                $form.get(0).submit();
            }
        });
Comments