Correct implementation of custom stripe checkout using alternating variables.

[だいやJobalisk]

Hello all. I'm not sure if this is the right place for this question or not, but here goes.

I'm new to stripe and I've been trying to work out how to implement a checkout form where the description and amount variables alternate between purchases. I've tried numerous different methods but I can't seem to get it to send the token information to the server. In its most basic appearance, my code looks like this:

           <p><input id="buy-submit-button" class="button" type="submit" value="チェックアウト"></input></p>

           <script> 

            var handler = StripeCheckout.configure({

                key: 'pk_test_g6do5S237ekq10r65BnxO6S0',

                locale: 'auto',

                token: function(token) {

                        //don't know what needs to go here

                }

            });

                document.getElementById("buy-submit-button").addEventListener('click', function(e) {

                setTimeout(function(){ 

                    var totalCost = 0; 

                    var totalCartLoad = ""; 

                    totalCost = localStorage.getItem('totalCartPrice'); 

                    totalCartLoad = localStorage.getItem('whatsInCart'); 

                    totalCartLoad = totalCartLoad.replace('undefined',''); 

                    // Open Checkout with further options:

                    handler.open({

                        name: "チェックアウト",

                        description: totalCartLoad,

                        shippingAddress: true,

                        billingAddress: true,

                        zipCode: true,

                        allowRememberMe: true,

                        currency: 'JPY',

                        amount: totalCost

                    });

                    e.preventDefault();

                }, 500);

            });

            // Close Checkout on page navigation:

            window.addEventListener('popstate', function() {

                handler.close();

            });

           </script>

I currently don't have form tags surrounding this.

Any help would be appreciated

Thanks

[Remi J.]

Hello!

When you use Custom Checkout [1], you get the Token object [2] back in the `token()` callback. This means that Checkout won't submit it to your server for you and you are in control of the flow.

The idea is that in the `token()` callback you will retrieve the token, access the id `tok_XXX` and then send it to your server along with other relevant information that you might have. The easiest solution is to use a form on your page and pass the token id in a hidden form. You can see a full example in PHP here [3]. You can also see a jsfiddle for the client-side part here [4]. Another solution would be to use Ajax to send the data to your server without having to use a form or submit the page.

I hope this helps get you in the right direction! If you have any follow up questions, I'd recommend contacting our support team directly: https://support.stripe.com/email

Best,

Remi

[1] https://stripe.com/docs/checkout#integration-custom

[2] https://stripe.com/docs/api#token_object

[3] https://gist.github.com/anonymous/95377db1e4bce91b9331#file-test_charge_checkout_custom_amount-php-L60-L63

[4] http://jsfiddle.net/w55p48vd/

--
You received this message because you are subscribed to the Google Groups "Stripe API Discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email to api-discuss+unsubscribe@lists.stripe.com.
To post to this group, send email to api-d...@lists.stripe.com.
Visit this group at https://groups.google.com/a/lists.stripe.com/group/api-discuss/.