Want more features on Pastebin? Sign Up, it's FREE!
Guest

Untitled

By: a guest on Sep 29th, 2012  |  syntax: None  |  size: 3.17 KB  |  views: 29  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.     <head>
  4.         <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
  5.         <title>Stripe Getting Started Form</title>
  6.         <script type="text/javascript" src="https://js.stripe.com/v1/"></script>
  7.         <!-- jQuery is used only for this example; it isn't required to use Stripe -->
  8.         <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
  9.         <script type="text/javascript">
  10.             // this identifies your website in the createToken call below
  11.             Stripe.setPublishableKey('YOUR_PUBLISHABLE_KEY');
  12.  
  13.             function stripeResponseHandler(status, response) {
  14.                 if (response.error) {
  15.                     // re-enable the submit button
  16.                     $('.submit-button').removeAttr("disabled");
  17.                     // show the errors on the form
  18.                     $(".payment-errors").html(response.error.message);
  19.                 } else {
  20.                     var form$ = $("#payment-form");
  21.                     // token contains id, last4, and card type
  22.                     var token = response['id'];
  23.                     // insert the token into the form so it gets submitted to the server
  24.                     form$.append("<input type='hidden' name='stripeToken' value='" + token + "' />");
  25.                     // and submit
  26.                     form$.get(0).submit();
  27.                 }
  28.             }
  29.  
  30.             $(document).ready(function() {
  31.                 $("#payment-form").submit(function(event) {
  32.                     // disable the submit button to prevent repeated clicks
  33.                     $('.submit-button').attr("disabled", "disabled");
  34.                     // createToken returns immediately - the supplied callback submits the form if there are no errors
  35.                     Stripe.createToken({
  36.                         number: $('.card-number').val(),
  37.                         cvc: $('.card-cvc').val(),
  38.                         exp_month: $('.card-expiry-month').val(),
  39.                         exp_year: $('.card-expiry-year').val()
  40.                     }, stripeResponseHandler);
  41.                     return false; // submit from callback
  42.                 });
  43.             });
  44.  
  45.         </script>
  46.     </head>
  47.     <body>
  48.         <h1>Charge $10 with Stripe</h1>
  49.         <!-- to display errors returned by createToken -->
  50.         <span class="payment-errors"></span>
  51.         <form action="" method="POST" id="payment-form">
  52.             <div class="form-row">
  53.                 <label>Card Number</label>
  54.                 <input type="text" size="20" autocomplete="off" class="card-number" />
  55.             </div>
  56.             <div class="form-row">
  57.                 <label>CVC</label>
  58.                 <input type="text" size="4" autocomplete="off" class="card-cvc" />
  59.             </div>
  60.             <div class="form-row">
  61.                 <label>Expiration (MM/YYYY)</label>
  62.                 <input type="text" size="2" class="card-expiry-month"/>
  63.                 <span> / </span>
  64.                 <input type="text" size="4" class="card-expiry-year"/>
  65.             </div>
  66.             <button type="submit" class="submit-button">Submit Payment</button>
  67.         </form>
  68.     </body>
  69. </html>
clone this paste RAW Paste Data