×

Welcome to TagMyCode

Please login or create account to add a snippet.
 

stripeForm.html

0
0
 
0
Language: HTML
Posted by: tharun pt
Added: Jan 1, 2016 12:43 PM
Views: 1922
Tags: stripeform
  1. <html>
  2.   <head>
  3.     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js">
  4.     <!---->
  5.     </script>
  6.     <script type="text/javascript" src="https://js.stripe.com/v2/">
  7.     <!---->
  8.     </script>
  9.    
  10.   </head>
  11.   <body>
  12.     <form id="payment-form" action="" method="post">
  13.       <div class="form-row">
  14.         <label>
  15.         <span>Card Number</span> <input type="text" data-stripe="number" size="20">
  16.         </label>
  17.       </div>
  18.       <div class="form-row">
  19.         <label>
  20.         <span>CVC</span> <input type="text" data-stripe="cvc" size="4"> </label>
  21.       </div>
  22.       <div class="form-row">
  23.         <label>
  24.         <span>Expiration (MM/YYYY)</span> <input type="text" data-stripe="exp-month" size="2">
  25.         </label> <span>/ </span><input type="text" data-stripe="exp-year" size="4">
  26.       </div>
  27.       <button type="submit">
  28.       Submit Payment</button>
  29.     </form>
  30.     <script type="text/javascript">
  31.     <!--// This identifies your website in the createToken call below
  32.  Stripe.setPublishableKey('pk_test_6pRNASCoBOKtIshFeQd4XMUh');
  33.  // ...
  34.  
  35.  
  36. jQuery(function($) {
  37.  $('#payment-form').submit(function(event) {
  38.    var $form = $(this);
  39.    // Disable the submit button to prevent repeated clicks
  40.    $form.find('button').prop('disabled', true);
  41.  
  42.    Stripe.card.createToken($form, stripeResponseHandler);
  43.  
  44.    // Prevent the form from submitting with the default action
  45.    return false;
  46.  });
  47. });
  48.  
  49. function stripeResponseHandler(status, response) {
  50.  var $form = $('#payment-form');
  51.  
  52.  if (response.error) {
  53.    // Show the errors on the form
  54.    $form.find('.payment-errors').text(response.error.message);
  55.    $form.find('button').prop('disabled', false);
  56.  } else {
  57.    // response contains id and card, which contains additional card details
  58.    var token = response.id;
  59.    // Insert the token into the form so it gets submitted to the server
  60.    $form.append($('<input type="hidden" name="stripeToken" />').val(token));
  61.    // and submit
  62.    $form.get(0).submit();
  63.  }
  64. };-->
  65.     </script>
  66.   </body>
  67. </html>
  68.  

Write a comment

To post comments, please log in or register.