CODEWITHSUNDEEP
phphtmllaravelstripe-payments
LoveAndHappiness
LoveAndHappiness

Reputation: 10135

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?

Upvotes: 2

Views: 1491

Answers (2)

Mysteryos
Mysteryos

Reputation: 5791

Your form has no 'submit' button, nor does the #stripeButton.

If your form is not submitting, then your method will never get called.

If you want to call the method in your routes.php file, add an <input type="submit" name="Submit Stripe" /> to inside your form.

Upvotes: 1

LoveAndHappiness
LoveAndHappiness

Reputation: 10135

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();
            }
        });

Upvotes: 0

Related Questions