stripe_js.js


            // Setting the error class and error element for form validation.
            jQuery.validator.setDefaults({
            //    errorClass: "text-danger",
            //    errorElement: "small"
            });

            function showProcessing() {
                $('.subscribe-process').show();
            }

            function hideProcessing() {
                $('.subscribe-process').hide();
           }

            // Handling and displaying error during form submit.
           function subscribeErrorHandler(jqXHR, textStatus, errorThrown) {
                    try{
                        var resp = JSON.parse(jqXHR.responseText);
                        if ('error_param' in resp) {
                           var errorMap = {};
                            var errParam = resp.error_param;
                            var errMsg = resp.error_msg;
                            errorMap[errParam] = errMsg;
                            $("#subscribe-form").validate().showErrors(errorMap);
                       } else {
                            var errMsg = resp.error_msg;
                            $(".alert-danger").show().text(errMsg);
                        }
                    } catch(err) {
                        $(".alert-danger").show().text("");
                    }
            }

            // Forward to thank you page after receiving success response.
            function subscribeResponseHandler(responseJSON) {
                window.location.replace(responseJSON.forward);
            }


            function handleStripeToken(token, args) {
                        form = $("#subscribe-form");
                        $("input[name='stripeToken']").val(token.id );
                        var options = {
                            beforeSend: showProcessing,
                            // post-submit callback when error returns
                            error: subscribeErrorHandler,
                            // post-submit callback when success returns
                            success: subscribeResponseHandler,
                            complete: hideProcessing,
                            contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
                            dataType: 'json'
                        };
                        // Doing AJAX form submit to your server.
                        form.ajaxSubmit(options);
                        return false;
                    }


            $(document).ready(function() {
                $("#subscribe-form").validate({
                    rules: {
                        //zip_code: {number: false},
                        //phone: {number: false}
                    }
                });

                // Creating Stripe Checkout handler object and also
                // configuring Stripe publishable key and setting the options in Stripe Js.
                var handler = StripeCheckout.configure({
                    //Replace it with your stripe publishable key
                    key: 'pk_test_EJ8PRnnt5IJTwypSzkyAgbAv',
                    currency: 'gbp',
                    allowRememberMe: false,
                    token: handleStripeToken
                });

                // Calling Stripe Js to display pop up on button click event
                $("#submit-btn").on('click', function(e) {
                    var amount = $("#due").val() * 100;
                    var form = $("#subscribe-form");
                    if(!$(form).valid()) {
                        return false;
                    }
                    handler.open({
                           name: 'Test',
                           description: $('#plan-desc').val(),
                           amount: amount,
                           email: $('#email').val(),
                           billingAddress: 'true',
                           zipCode: 'true',
                    });
                    return false;
                });


            });