// Stripe API Key //var stripe = Stripe('_____YOUR_STRIPE_PUBLISHABLE_KEY___'); //var stripe = Stripe('pk_test_I45MBjoPMVmscQpXhvvz4u5U'); var stripe = Stripe('pk_live_0rrPEM95HrxX3AXEyXKqiqWN'); var elements = stripe.elements(); // Custom Styling var style = { base: { color: '#32325d', lineHeight: '24px', fontFamily: '"Helvetica Neue", Helvetica, sans-serif', fontSmoothing: 'antialiased', fontSize: '16px', '::placeholder': { color: '#aab7c4' } }, invalid: { color: '#fa755a', iconColor: '#fa755a' } };// Create an instance of the card Element var card = elements.create('card', {style: style});// Add an instance of the card Element into the `card-element`
card.mount('#card-element');// Handle real-time validation errors from the card Element. card.addEventListener('change', function(event) { var displayError = document.getElementById('card-errors');if (event.error) { displayError.textContent = event.error.message; } else { displayError.textContent = ''; } });// Handle form submission var form = document.getElementById('registerform');form.addEventListener('submit', function(event) { event.preventDefault();stripe.createToken(card).then(function(result) { if (result.error) { // Inform the user if there was an error var errorElement = document.getElementById('card-errors'); errorElement.textContent = result.error.message; } else { stripeTokenHandler(result.token); } }); }); // Send Stripe Token to Server function stripeTokenHandler(token) { // Insert the token ID into the form so it gets submitted to the server var form = document.getElementById('registerform');// Add Stripe Token to hidden input var hiddenInput = document.createElement('input'); hiddenInput.setAttribute('type', 'hidden'); hiddenInput.setAttribute('name', 'stripeToken'); hiddenInput.setAttribute('value', token.id); form.appendChild(hiddenInput);// Submit form form.submit(); }