Skip to content

Instantly share code, notes, and snippets.

@msGenDev

msGenDev/StripeTutorialPage.html

Forked from briancollins/StripeTutorialPage.html
Last active August 29, 2015 14:06
Show Gist options
  • Save msGenDev/2f32a7e5d0faaa2a0a4a to your computer and use it in GitHub Desktop.
Save msGenDev/2f32a7e5d0faaa2a0a4a to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. @brian-stripe brian-stripe revised this gist Feb 15, 2014. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion StripeTutorialPage.html
    View file
    Original file line number Diff line number Diff line change
    @@ -38,7 +38,7 @@
    // Disable the submit button to prevent repeated clicks
    $form.find('button').prop('disabled', true);

    Stripe.createToken($form, stripeResponseHandler);
    Stripe.card.createToken($form, stripeResponseHandler);

    // Prevent the form from submitting with the default action
    return false;
  2. @briancollins briancollins revised this gist Aug 28, 2013. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion StripeTutorialPage.html
    View file
    Original file line number Diff line number Diff line change
    @@ -5,7 +5,7 @@
    <title>Stripe Getting Started Form</title>

    <!-- The required Stripe lib -->
    <script type="text/javascript" src="https://js.stripe.com/v1/"></script>
    <script type="text/javascript" src="https://js.stripe.com/v2/"></script>

    <!-- jQuery is used only for this example; it isn't required to use Stripe -->
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
  3. @maccman maccman revised this gist Feb 28, 2013. 1 changed file with 26 additions and 24 deletions.
    50 changes: 26 additions & 24 deletions StripeTutorialPage.html
    View file
    Original file line number Diff line number Diff line change
    @@ -3,40 +3,42 @@
    <head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <title>Stripe Getting Started Form</title>

    <!-- The required Stripe lib -->
    <script type="text/javascript" src="https://js.stripe.com/v1/"></script>

    <!-- jQuery is used only for this example; it isn't required to use Stripe -->
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

    <script type="text/javascript">
    // this identifies your website in the createToken call below
    // This identifies your website in the createToken call below
    Stripe.setPublishableKey('YOUR_PUBLISHABLE_KEY');

    function stripeResponseHandler(status, response) {
    var stripeResponseHandler = function(status, response) {
    var $form = $('#payment-form');

    if (response.error) {
    // Show the errors on the form
    $('.payment-errors').text(response.error.message);
    $('.submit-button').prop('disabled', false);
    $form.find('.payment-errors').text(response.error.message);
    $form.find('button').prop('disabled', false);
    } else {
    var $form = $('#payment-form');
    // token contains id, last4, and card type
    var token = response.id;
    // Insert the token into the form so it gets submitted to the server
    $form.append($('<input type="hidden" name="stripeToken" />').val(token));
    // and submit
    // and re-submit
    $form.get(0).submit();
    }
    }
    };

    jQuery(function($) {
    $('#payment-form').submit(function(e) {
    var $form = $(this);

    $(function() {
    $('#payment-form').submit(function(event) {
    // Disable the submit button to prevent repeated clicks
    $('.submit-button').prop('disabled', true);
    $form.find('button').prop('disabled', true);

    Stripe.createToken({
    number: $('.card-number').val(),
    cvc: $('.card-cvc').val(),
    exp_month: $('.card-expiry-month').val(),
    exp_year: $('.card-expiry-year').val()
    }, stripeResponseHandler);
    Stripe.createToken($form, stripeResponseHandler);

    // Prevent the form from submitting with the default action
    return false;
    @@ -46,34 +48,34 @@
    </head>
    <body>
    <h1>Charge $10 with Stripe</h1>
    <!-- to display errors returned by createToken -->
    <span class="payment-errors"></span>

    <form action="" method="POST" id="payment-form">
    <span class="payment-errors"></span>

    <div class="form-row">
    <label>
    <span>Card Number</span>
    <input type="text" size="20" autocomplete="off" class="card-number"/>
    <input type="text" size="20" data-stripe="number"/>
    </label>
    </div>

    <div class="form-row">
    <label>
    <span>CVC</span>
    <input type="text" size="4" autocomplete="off" class="card-cvc"/>
    <input type="text" size="4" data-stripe="cvc"/>
    </label>
    </div>

    <div class="form-row">
    <label>
    <span>Expiration (MM/YYYY)</span>
    <input type="text" size="2" class="card-expiry-month"/>
    <input type="text" size="2" data-stripe="exp-month"/>
    </label>
    <span> / </span>
    <input type="text" size="4" class="card-expiry-year"/>
    <input type="text" size="4" data-stripe="exp-year"/>
    </div>

    <button type="submit" class="submit-button">Submit Payment</button>
    <button type="submit">Submit Payment</button>
    </form>
    </body>
    </html>
  4. @maccman maccman revised this gist Jan 15, 2013. 1 changed file with 4 additions and 4 deletions.
    8 changes: 4 additions & 4 deletions StripeTutorialPage.html
    View file
    Original file line number Diff line number Diff line change
    @@ -32,10 +32,10 @@
    $('.submit-button').prop('disabled', true);

    Stripe.createToken({
    number: $('.card-number').val(),
    cvc: $('.card-cvc').val(),
    exp_month: $('.card-expiry-month').val(),
    exp_year: $('.card-expiry-year').val()
    number: $('.card-number').val(),
    cvc: $('.card-cvc').val(),
    exp_month: $('.card-expiry-month').val(),
    exp_year: $('.card-expiry-year').val()
    }, stripeResponseHandler);

    // Prevent the form from submitting with the default action
  5. @maccman maccman revised this gist Jan 15, 2013. 1 changed file with 68 additions and 69 deletions.
    137 changes: 68 additions & 69 deletions StripeTutorialPage.html
    View file
    Original file line number Diff line number Diff line change
    @@ -1,80 +1,79 @@
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <title>Stripe Getting Started Form</title>
    <script type="text/javascript" src="https://js.stripe.com/v1/"></script>
    <!-- jQuery is used only for this example; it isn't required to use Stripe -->
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript">
    // this identifies your website in the createToken call below
    Stripe.setPublishableKey('YOUR_PUBLISHABLE_KEY');
    <head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <title>Stripe Getting Started Form</title>
    <script type="text/javascript" src="https://js.stripe.com/v1/"></script>
    <!-- jQuery is used only for this example; it isn't required to use Stripe -->
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript">
    // this identifies your website in the createToken call below
    Stripe.setPublishableKey('YOUR_PUBLISHABLE_KEY');

    function stripeResponseHandler(status, response) {
    if (response.error) {
    // Show the errors on the form
    $('.payment-errors').text(response.error.message);
    $('.submit-button').prop('disabled', false);
    } else {
    var $form = $('#payment-form');
    // token contains id, last4, and card type
    var token = response.id;
    // Insert the token into the form so it gets submitted to the server
    $form.append($('<input type="hidden" name="stripeToken" />').val(token));
    // and submit
    $form.get(0).submit();
    }
    }
    function stripeResponseHandler(status, response) {
    if (response.error) {
    // Show the errors on the form
    $('.payment-errors').text(response.error.message);
    $('.submit-button').prop('disabled', false);
    } else {
    var $form = $('#payment-form');
    // token contains id, last4, and card type
    var token = response.id;
    // Insert the token into the form so it gets submitted to the server
    $form.append($('<input type="hidden" name="stripeToken" />').val(token));
    // and submit
    $form.get(0).submit();
    }
    }

    $(function() {
    $('#payment-form').submit(function(event) {
    // Disable the submit button to prevent repeated clicks
    $('.submit-button').prop('disabled', true);
    $(function() {
    $('#payment-form').submit(function(event) {
    // Disable the submit button to prevent repeated clicks
    $('.submit-button').prop('disabled', true);

    Stripe.createToken({
    number: $('.card-number').val(),
    cvc: $('.card-cvc').val(),
    exp_month: $('.card-expiry-month').val(),
    exp_year: $('.card-expiry-year').val()
    }, stripeResponseHandler);
    Stripe.createToken({
    number: $('.card-number').val(),
    cvc: $('.card-cvc').val(),
    exp_month: $('.card-expiry-month').val(),
    exp_year: $('.card-expiry-year').val()
    }, stripeResponseHandler);

    // Prevent the form from submitting with the default action
    return false;
    });
    });
    // Prevent the form from submitting with the default action
    return false;
    });
    });
    </script>
    </head>
    <body>
    <h1>Charge $10 with Stripe</h1>
    <!-- to display errors returned by createToken -->
    <span class="payment-errors"></span>

    </script>
    </head>
    <body>
    <h1>Charge $10 with Stripe</h1>
    <!-- to display errors returned by createToken -->
    <span class="payment-errors"></span>
    <form action="" method="POST" id="payment-form">
    <div class="form-row">
    <label>
    <span>Card Number</span>
    <input type="text" size="20" autocomplete="off" class="card-number"/>
    </label>
    </div>

    <form action="" method="POST" id="payment-form">
    <div class="form-row">
    <label>
    <span>Card Number</span>
    <input type="text" size="20" autocomplete="off" class="card-number"/>
    </label>
    </div>
    <div class="form-row">
    <label>
    <span>CVC</span>
    <input type="text" size="4" autocomplete="off" class="card-cvc"/>
    </label>
    </div>

    <div class="form-row">
    <label>
    <span>CVC</span>
    <input type="text" size="4" autocomplete="off" class="card-cvc"/>
    </label>
    </div>
    <div class="form-row">
    <label>
    <span>Expiration (MM/YYYY)</span>
    <input type="text" size="2" class="card-expiry-month"/>
    </label>
    <span> / </span>
    <input type="text" size="4" class="card-expiry-year"/>
    </div>

    <div class="form-row">
    <label>
    <span>Expiration (MM/YYYY)</span>
    <input type="text" size="2" class="card-expiry-month"/>
    </label>
    <span> / </span>
    <input type="text" size="4" class="card-expiry-year"/>
    </div>

    <button type="submit" class="submit-button">Submit Payment</button>
    </form>
    </body>
    <button type="submit" class="submit-button">Submit Payment</button>
    </form>
    </body>
    </html>
  6. @maccman maccman revised this gist Jan 15, 2013. 1 changed file with 54 additions and 43 deletions.
    97 changes: 54 additions & 43 deletions StripeTutorialPage.html
    View file
    Original file line number Diff line number Diff line change
    @@ -5,41 +5,42 @@
    <title>Stripe Getting Started Form</title>
    <script type="text/javascript" src="https://js.stripe.com/v1/"></script>
    <!-- jQuery is used only for this example; it isn't required to use Stripe -->
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript">
    // this identifies your website in the createToken call below
    Stripe.setPublishableKey('YOUR_PUBLISHABLE_KEY');

    function stripeResponseHandler(status, response) {
    if (response.error) {
    // re-enable the submit button
    $('.submit-button').removeAttr("disabled");
    // show the errors on the form
    $(".payment-errors").html(response.error.message);
    } else {
    var form$ = $("#payment-form");
    // token contains id, last4, and card type
    var token = response['id'];
    // insert the token into the form so it gets submitted to the server
    form$.append("<input type='hidden' name='stripeToken' value='" + token + "' />");
    // and submit
    form$.get(0).submit();
    }
    if (response.error) {
    // Show the errors on the form
    $('.payment-errors').text(response.error.message);
    $('.submit-button').prop('disabled', false);
    } else {
    var $form = $('#payment-form');
    // token contains id, last4, and card type
    var token = response.id;
    // Insert the token into the form so it gets submitted to the server
    $form.append($('<input type="hidden" name="stripeToken" />').val(token));
    // and submit
    $form.get(0).submit();
    }
    }

    $(document).ready(function() {
    $("#payment-form").submit(function(event) {
    // disable the submit button to prevent repeated clicks
    $('.submit-button').attr("disabled", "disabled");
    // createToken returns immediately - the supplied callback submits the form if there are no errors
    Stripe.createToken({
    number: $('.card-number').val(),
    cvc: $('.card-cvc').val(),
    exp_month: $('.card-expiry-month').val(),
    exp_year: $('.card-expiry-year').val()
    }, stripeResponseHandler);
    return false; // submit from callback
    });
    $(function() {
    $('#payment-form').submit(function(event) {
    // Disable the submit button to prevent repeated clicks
    $('.submit-button').prop('disabled', true);

    Stripe.createToken({
    number: $('.card-number').val(),
    cvc: $('.card-cvc').val(),
    exp_month: $('.card-expiry-month').val(),
    exp_year: $('.card-expiry-year').val()
    }, stripeResponseHandler);

    // Prevent the form from submitting with the default action
    return false;
    });
    });

    </script>
    @@ -48,22 +49,32 @@
    <h1>Charge $10 with Stripe</h1>
    <!-- to display errors returned by createToken -->
    <span class="payment-errors"></span>

    <form action="" method="POST" id="payment-form">
    <div class="form-row">
    <label>Card Number</label>
    <input type="text" size="20" autocomplete="off" class="card-number" />
    </div>
    <div class="form-row">
    <label>CVC</label>
    <input type="text" size="4" autocomplete="off" class="card-cvc" />
    </div>
    <div class="form-row">
    <label>Expiration (MM/YYYY)</label>
    <input type="text" size="2" class="card-expiry-month"/>
    <span> / </span>
    <input type="text" size="4" class="card-expiry-year"/>
    </div>
    <button type="submit" class="submit-button">Submit Payment</button>
    <div class="form-row">
    <label>
    <span>Card Number</span>
    <input type="text" size="20" autocomplete="off" class="card-number"/>
    </label>
    </div>

    <div class="form-row">
    <label>
    <span>CVC</span>
    <input type="text" size="4" autocomplete="off" class="card-cvc"/>
    </label>
    </div>

    <div class="form-row">
    <label>
    <span>Expiration (MM/YYYY)</span>
    <input type="text" size="2" class="card-expiry-month"/>
    </label>
    <span> / </span>
    <input type="text" size="4" class="card-expiry-year"/>
    </div>

    <button type="submit" class="submit-button">Submit Payment</button>
    </form>
    </body>
    </html>
  7. @boucher boucher revised this gist Jul 20, 2012. 1 changed file with 0 additions and 3 deletions.
    3 changes: 0 additions & 3 deletions StripeTutorialPage.html
    View file
    Original file line number Diff line number Diff line change
    @@ -42,9 +42,6 @@
    });
    });

    if (window.location.protocol === 'file:') {
    alert("stripe.js does not work when included in pages served over file:// URLs. Try serving this page over a webserver. Contact [email protected] if you need assistance.");
    }
    </script>
    </head>
    <body>
  8. @boucher boucher revised this gist Feb 6, 2012. 1 changed file with 1 addition and 2 deletions.
    3 changes: 1 addition & 2 deletions StripeTutorialPage.html
    View file
    Original file line number Diff line number Diff line change
    @@ -31,14 +31,13 @@
    $("#payment-form").submit(function(event) {
    // disable the submit button to prevent repeated clicks
    $('.submit-button').attr("disabled", "disabled");
    var chargeAmount = 1000; //amount you want to charge, in cents. 1000 = $10.00, 2000 = $20.00 ...
    // createToken returns immediately - the supplied callback submits the form if there are no errors
    Stripe.createToken({
    number: $('.card-number').val(),
    cvc: $('.card-cvc').val(),
    exp_month: $('.card-expiry-month').val(),
    exp_year: $('.card-expiry-year').val()
    }, chargeAmount, stripeResponseHandler);
    }, stripeResponseHandler);
    return false; // submit from callback
    });
    });
  9. @anurag anurag revised this gist Dec 11, 2011. 1 changed file with 4 additions and 0 deletions.
    4 changes: 4 additions & 0 deletions StripeTutorialPage.html
    View file
    Original file line number Diff line number Diff line change
    @@ -42,6 +42,10 @@
    return false; // submit from callback
    });
    });

    if (window.location.protocol === 'file:') {
    alert("stripe.js does not work when included in pages served over file:// URLs. Try serving this page over a webserver. Contact [email protected] if you need assistance.");
    }
    </script>
    </head>
    <body>
  10. @anurag anurag revised this gist Sep 12, 2011. 1 changed file with 4 additions and 4 deletions.
    8 changes: 4 additions & 4 deletions StripeTutorialPage.html
    View file
    Original file line number Diff line number Diff line change
    @@ -7,14 +7,14 @@
    <!-- jQuery is used only for this example; it isn't required to use Stripe -->
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    <script type="text/javascript">
    //this identifies your website in the createToken call below
    // this identifies your website in the createToken call below
    Stripe.setPublishableKey('YOUR_PUBLISHABLE_KEY');

    function stripeResponseHandler(status, response) {
    if (response.error) {
    // re-enable the submit button
    $('.submit-button').removeAttr("disabled");
    //show the errors on the form
    // show the errors on the form
    $(".payment-errors").html(response.error.message);
    } else {
    var form$ = $("#payment-form");
    @@ -32,14 +32,14 @@
    // disable the submit button to prevent repeated clicks
    $('.submit-button').attr("disabled", "disabled");
    var chargeAmount = 1000; //amount you want to charge, in cents. 1000 = $10.00, 2000 = $20.00 ...
    //createToken returns immediately - the supplied callback submits the form if there are no errors
    // createToken returns immediately - the supplied callback submits the form if there are no errors
    Stripe.createToken({
    number: $('.card-number').val(),
    cvc: $('.card-cvc').val(),
    exp_month: $('.card-expiry-month').val(),
    exp_year: $('.card-expiry-year').val()
    }, chargeAmount, stripeResponseHandler);
    return false; //submit from callback
    return false; // submit from callback
    });
    });
    </script>
  11. @anurag anurag revised this gist Sep 12, 2011. 1 changed file with 0 additions and 5 deletions.
    5 changes: 0 additions & 5 deletions StripeTutorialPage.html
    View file
    Original file line number Diff line number Diff line change
    @@ -45,23 +45,18 @@
    </script>
    </head>
    <body>

    <h1>Charge $10 with Stripe</h1>

    <!-- to display errors returned by createToken -->
    <span class="payment-errors"></span>

    <form action="" method="POST" id="payment-form">
    <div class="form-row">
    <label>Card Number</label>
    <input type="text" size="20" autocomplete="off" class="card-number" />
    </div>

    <div class="form-row">
    <label>CVC</label>
    <input type="text" size="4" autocomplete="off" class="card-cvc" />
    </div>

    <div class="form-row">
    <label>Expiration (MM/YYYY)</label>
    <input type="text" size="2" class="card-expiry-month"/>
  12. @anurag anurag revised this gist Sep 12, 2011. 1 changed file with 11 additions and 28 deletions.
    39 changes: 11 additions & 28 deletions StripeTutorialPage.html
    View file
    Original file line number Diff line number Diff line change
    @@ -2,15 +2,15 @@
    <html lang="en">
    <head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <title>Stripe Tutorial Form</title>
    <title>Stripe Getting Started Form</title>
    <script type="text/javascript" src="https://js.stripe.com/v1/"></script>
    <!-- jQuery is used only for this example; it isn't required to use Stripe -->
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    <script type="text/javascript">
    //this identifies your website in the createToken call below
    Stripe.setPublishableKey('YOUR_PUBLISHABLE_KEY'); // get from https://manage.stripe.com/account
    Stripe.setPublishableKey('YOUR_PUBLISHABLE_KEY');

    var stripeResponseHandler = function(status, response) {
    function stripeResponseHandler(status, response) {
    if (response.error) {
    // re-enable the submit button
    $('.submit-button').removeAttr("disabled");
    @@ -29,16 +29,16 @@

    $(document).ready(function() {
    $("#payment-form").submit(function(event) {
    var amount = 1000; //amount you want to charge, in cents. 1000 = $10.00, 2000 = $20.00 ...
    // disable the submit button to prevent repeated clicks
    $('.submit-button').attr("disabled", "disabled");
    var chargeAmount = 1000; //amount you want to charge, in cents. 1000 = $10.00, 2000 = $20.00 ...
    //createToken returns immediately - the supplied callback submits the form if there are no errors
    Stripe.createToken({
    number: $('.card-number').val(),
    cvc: $('.card-cvc').val(),
    exp_month: $('.card-expiry-month').val(),
    exp_year: $('.card-expiry-year').val()
    }, amount, stripeResponseHandler);
    }, chargeAmount, stripeResponseHandler);
    return false; //submit from callback
    });
    });
    @@ -54,36 +54,19 @@ <h1>Charge $10 with Stripe</h1>
    <form action="" method="POST" id="payment-form">
    <div class="form-row">
    <label>Card Number</label>
    <input type="text" maxlength="20" autocomplete="off" class="card-number required" />
    <input type="text" size="20" autocomplete="off" class="card-number" />
    </div>

    <div class="form-row">
    <label>CVC</label>
    <input type="text" maxlength="4" autocomplete="off" class="card-cvc required" />
    <input type="text" size="4" autocomplete="off" class="card-cvc" />
    </div>

    <div class="form-row">
    <label>Expiration</label>
    <div class="expiry-wrapper">
    <select class="card-expiry-month required">
    </select>
    <script type="text/javascript">
    //populate the expiration month dropdown
    var select = $(".card-expiry-month");
    for (var i = 1; i <= 12; i++) {
    select.append($("<option value='"+i+"'>"+i+"</option>"))
    }
    </script>
    <span> / </span>
    <select class="card-expiry-year required"></select>
    <script type="text/javascript">
    var select = $(".card-expiry-year"),
    year = new Date().getFullYear();
    for (var i = 1; i < 10; i++) {
    select.append($("<option value='"+(i + year)+"' "+(i === 0 ? "selected" : "")+">"+(i + year)+"</option>"))
    }
    </script>
    </div>
    <label>Expiration (MM/YYYY)</label>
    <input type="text" size="2" class="card-expiry-month"/>
    <span> / </span>
    <input type="text" size="4" class="card-expiry-year"/>
    </div>
    <button type="submit" class="submit-button">Submit Payment</button>
    </form>
  13. @anurag anurag revised this gist Sep 12, 2011. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion StripeTutorialPage.html
    View file
    Original file line number Diff line number Diff line change
    @@ -8,7 +8,7 @@
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    <script type="text/javascript">
    //this identifies your website in the createToken call below
    Stripe.setPublishableKey('YOUR_PUBLISHABLE_KEY');
    Stripe.setPublishableKey('YOUR_PUBLISHABLE_KEY'); // get from https://manage.stripe.com/account

    var stripeResponseHandler = function(status, response) {
    if (response.error) {
  14. @anurag anurag revised this gist Sep 12, 2011. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion StripeTutorialPage.html
    View file
    Original file line number Diff line number Diff line change
    @@ -8,7 +8,7 @@
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    <script type="text/javascript">
    //this identifies your website in the createToken call below
    Stripe.setPublishableKey('pk_Mt4UGpSnJq4CesyhzUgcz1a99OpJl');
    Stripe.setPublishableKey('YOUR_PUBLISHABLE_KEY');

    var stripeResponseHandler = function(status, response) {
    if (response.error) {
  15. @anurag anurag renamed this gist Sep 11, 2011. 1 changed file with 0 additions and 0 deletions.
    0 gistfile1.html → StripeTutorialPage.html
    View file
    File renamed without changes.
  16. @anurag anurag revised this gist Sep 11, 2011. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion gistfile1.html
    View file
    Original file line number Diff line number Diff line change
    @@ -51,7 +51,7 @@ <h1>Charge $10 with Stripe</h1>
    <!-- to display errors returned by createToken -->
    <span class="payment-errors"></span>

    <form action="" method="post" id="payment-form">
    <form action="" method="POST" id="payment-form">
    <div class="form-row">
    <label>Card Number</label>
    <input type="text" maxlength="20" autocomplete="off" class="card-number required" />
  17. @anurag anurag revised this gist Sep 11, 2011. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions gistfile1.html
    View file
    Original file line number Diff line number Diff line change
    @@ -2,10 +2,10 @@
    <html lang="en">
    <head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <title>Stripe Getting Started Form</title>
    <title>Stripe Tutorial Form</title>
    <script type="text/javascript" src="https://js.stripe.com/v1/"></script>
    <!-- jQuery is used only for this example; it isn't required to use Stripe -->
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    <script type="text/javascript" src="https://js.stripe.com/v1/"></script>
    <script type="text/javascript">
    //this identifies your website in the createToken call below
    Stripe.setPublishableKey('pk_Mt4UGpSnJq4CesyhzUgcz1a99OpJl');
  18. @anurag anurag revised this gist Sep 10, 2011. 1 changed file with 2 additions and 7 deletions.
    9 changes: 2 additions & 7 deletions gistfile1.html
    View file
    Original file line number Diff line number Diff line change
    @@ -29,7 +29,7 @@

    $(document).ready(function() {
    $("#payment-form").submit(function(event) {
    var chargeAmount = 1000; //amount you want to charge, in cents. 1000 = $10.00, 2000 = $20.00 ...
    var amount = 1000; //amount you want to charge, in cents. 1000 = $10.00, 2000 = $20.00 ...
    // disable the submit button to prevent repeated clicks
    $('.submit-button').attr("disabled", "disabled");
    //createToken returns immediately - the supplied callback submits the form if there are no errors
    @@ -38,7 +38,7 @@
    cvc: $('.card-cvc').val(),
    exp_month: $('.card-expiry-month').val(),
    exp_year: $('.card-expiry-year').val()
    }, chargeAmount, stripeResponseHandler);
    }, amount, stripeResponseHandler);
    return false; //submit from callback
    });
    });
    @@ -52,11 +52,6 @@ <h1>Charge $10 with Stripe</h1>
    <span class="payment-errors"></span>

    <form action="" method="post" id="payment-form">
    <div class="form-row">
    <label for="name" class="stripeLabel">Your Name</label>
    <input type="text" name="name" class="required" />
    </div>

    <div class="form-row">
    <label>Card Number</label>
    <input type="text" maxlength="20" autocomplete="off" class="card-number required" />
  19. @anurag anurag revised this gist Sep 9, 2011. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion gistfile1.html
    View file
    Original file line number Diff line number Diff line change
    @@ -51,7 +51,7 @@ <h1>Charge $10 with Stripe</h1>
    <!-- to display errors returned by createToken -->
    <span class="payment-errors"></span>

    <form action="" method="post" id="payment-form"> {% csrf_token %}
    <form action="" method="post" id="payment-form">
    <div class="form-row">
    <label for="name" class="stripeLabel">Your Name</label>
    <input type="text" name="name" class="required" />
  20. @anurag anurag revised this gist Sep 9, 2011. 1 changed file with 7 additions and 6 deletions.
    13 changes: 7 additions & 6 deletions gistfile1.html
    View file
    Original file line number Diff line number Diff line change
    @@ -29,6 +29,7 @@

    $(document).ready(function() {
    $("#payment-form").submit(function(event) {
    var chargeAmount = 1000; //amount you want to charge, in cents. 1000 = $10.00, 2000 = $20.00 ...
    // disable the submit button to prevent repeated clicks
    $('.submit-button').attr("disabled", "disabled");
    //createToken returns immediately - the supplied callback submits the form if there are no errors
    @@ -37,7 +38,7 @@
    cvc: $('.card-cvc').val(),
    exp_month: $('.card-expiry-month').val(),
    exp_year: $('.card-expiry-year').val()
    }, 1000, stripeResponseHandler);
    }, chargeAmount, stripeResponseHandler);
    return false; //submit from callback
    });
    });
    @@ -50,26 +51,26 @@ <h1>Charge $10 with Stripe</h1>
    <!-- to display errors returned by createToken -->
    <span class="payment-errors"></span>

    <form action="" method="post" id="payment-form">
    <form action="" method="post" id="payment-form"> {% csrf_token %}
    <div class="form-row">
    <label for="name" class="stripeLabel">Your Name</label>
    <input type="text" name="name" class="required" />
    </div>

    <div class="form-row">
    <label>Card Number</label>
    <input type="text" maxlength="20" autocomplete="off" class="card-number stripe-sensitive required" />
    <input type="text" maxlength="20" autocomplete="off" class="card-number required" />
    </div>

    <div class="form-row">
    <label>CVC</label>
    <input type="text" maxlength="4" autocomplete="off" class="card-cvc stripe-sensitive required" />
    <input type="text" maxlength="4" autocomplete="off" class="card-cvc required" />
    </div>

    <div class="form-row">
    <label>Expiration</label>
    <div class="expiry-wrapper">
    <select class="card-expiry-month stripe-sensitive required">
    <select class="card-expiry-month required">
    </select>
    <script type="text/javascript">
    //populate the expiration month dropdown
    @@ -79,7 +80,7 @@ <h1>Charge $10 with Stripe</h1>
    }
    </script>
    <span> / </span>
    <select class="card-expiry-year stripe-sensitive required"></select>
    <select class="card-expiry-year required"></select>
    <script type="text/javascript">
    var select = $(".card-expiry-year"),
    year = new Date().getFullYear();
  21. @anurag anurag revised this gist Sep 9, 2011. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion gistfile1.html
    View file
    Original file line number Diff line number Diff line change
    @@ -50,7 +50,7 @@ <h1>Charge $10 with Stripe</h1>
    <!-- to display errors returned by createToken -->
    <span class="payment-errors"></span>

    <form action="" method="post" id="payment-form"> {% csrf_token %}
    <form action="" method="post" id="payment-form">
    <div class="form-row">
    <label for="name" class="stripeLabel">Your Name</label>
    <input type="text" name="name" class="required" />
  22. @anurag anurag revised this gist Sep 9, 2011. 1 changed file with 23 additions and 21 deletions.
    44 changes: 23 additions & 21 deletions gistfile1.html
    View file
    Original file line number Diff line number Diff line change
    @@ -8,10 +8,27 @@
    <script type="text/javascript" src="https://js.stripe.com/v1/"></script>
    <script type="text/javascript">
    //this identifies your website in the createToken call below
    Stripe.setPublishableKey('YOUR_PUBLISHABLE_KEY');
    Stripe.setPublishableKey('pk_Mt4UGpSnJq4CesyhzUgcz1a99OpJl');

    var stripeResponseHandler = function(status, response) {
    if (response.error) {
    // re-enable the submit button
    $('.submit-button').removeAttr("disabled");
    //show the errors on the form
    $(".payment-errors").html(response.error.message);
    } else {
    var form$ = $("#payment-form");
    // token contains id, last4, and card type
    var token = response['id'];
    // insert the token into the form so it gets submitted to the server
    form$.append("<input type='hidden' name='stripeToken' value='" + token + "' />");
    // and submit
    form$.get(0).submit();
    }
    }

    $(document).ready(function() {
    $("#example-form").submit(function(event) {
    $("#payment-form").submit(function(event) {
    // disable the submit button to prevent repeated clicks
    $('.submit-button').attr("disabled", "disabled");
    //createToken returns immediately - the supplied callback submits the form if there are no errors
    @@ -20,24 +37,9 @@
    cvc: $('.card-cvc').val(),
    exp_month: $('.card-expiry-month').val(),
    exp_year: $('.card-expiry-year').val()
    }, 1000, function(status, response) { //1000 validates the card for $10.00, 1500 for $15.00...
    if (response.error) {
    // re-enable the submit button
    $('.submit-button').removeAttr("disabled");
    //show the errors on the form
    $(".payment-errors").html(response.error.message);
    } else {
    var form$ = $("#example-form");
    // token contains id, last4, and card type
    var token = response['id'];
    // insert the token into the form so it gets submitted to the server
    form$.append("<input type='hidden' name='stripeToken' value='" + token + "' />");
    // and submit
    form$.get(0).submit();
    }
    });
    return false; //submit only from callback
    })
    }, 1000, stripeResponseHandler);
    return false; //submit from callback
    });
    });
    </script>
    </head>
    @@ -48,7 +50,7 @@ <h1>Charge $10 with Stripe</h1>
    <!-- to display errors returned by createToken -->
    <span class="payment-errors"></span>

    <form action="" method="post" id="example-form"> {% csrf_token %}
    <form action="" method="post" id="payment-form"> {% csrf_token %}
    <div class="form-row">
    <label for="name" class="stripeLabel">Your Name</label>
    <input type="text" name="name" class="required" />
  23. @anurag anurag revised this gist Sep 8, 2011. 1 changed file with 34 additions and 101 deletions.
    135 changes: 34 additions & 101 deletions gistfile1.html
    View file
    Original file line number Diff line number Diff line change
    @@ -2,159 +2,92 @@
    <html lang="en">
    <head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <title>Stripe Sample Form</title>

    <title>Stripe Getting Started Form</title>
    <!-- jQuery is used only for this example; it isn't required to use Stripe -->
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    <script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.8.1/jquery.validate.min.js"></script>
    <script type="text/javascript" src="https://js.stripe.com/v1/"></script>
    <script type="text/javascript">
    Stripe.setPublishableKey('pk_YOUR_PUBLISHABLE_KEY');
    $(document).ready(function() {
    function addInputNames() {
    // Not ideal, but jQuery's validate plugin requires fields to have names
    // so we add them at the last possible minute, in case any javascript
    // exceptions have caused other parts of the script to fail.
    $(".card-number").attr("name", "card-number")
    $(".card-cvc").attr("name", "card-cvc")
    $(".card-expiry-year").attr("name", "card-expiry-year")
    }

    function removeInputNames() {
    $(".card-number").removeAttr("name")
    $(".card-cvc").removeAttr("name")
    $(".card-expiry-year").removeAttr("name")
    }

    function submit(form) {
    // remove the input field names for security
    // we do this *before* anything else which might throw an exception
    removeInputNames(); // THIS IS IMPORTANT!

    // given a valid form, submit the payment details to stripe
    $(form['submit-button']).attr("disabled", "disabled")
    //this identifies your website in the createToken call below
    Stripe.setPublishableKey('YOUR_PUBLISHABLE_KEY');

    $(document).ready(function() {
    $("#example-form").submit(function(event) {
    // disable the submit button to prevent repeated clicks
    $('.submit-button').attr("disabled", "disabled");
    //createToken returns immediately - the supplied callback submits the form if there are no errors
    Stripe.createToken({
    number: $('.card-number').val(),
    cvc: $('.card-cvc').val(),
    exp_month: $('.card-expiry-month').val(),
    exp_month: $('.card-expiry-month').val(),
    exp_year: $('.card-expiry-year').val()
    }, 100, function(status, response) {
    }, 1000, function(status, response) { //1000 validates the card for $10.00, 1500 for $15.00...
    if (response.error) {
    // re-enable the submit button
    $(form['submit-button']).removeAttr("disabled")

    // show the error
    $('.submit-button').removeAttr("disabled");
    //show the errors on the form
    $(".payment-errors").html(response.error.message);

    // we add these names back in so we can revalidate properly
    addInputNames();
    } else {
    var form$ = $("#example-form");
    // token contains id, last4, and card type
    var token = response['id'];

    // insert the stripe token
    var input = $("<input name='stripeToken' value='" + token + "' style='display:none;' />");
    form.appendChild(input[0])

    // insert the token into the form so it gets submitted to the server
    form$.append("<input type='hidden' name='stripeToken' value='" + token + "' />");
    // and submit
    form.submit();
    form$.get(0).submit();
    }
    });

    return false;
    }

    // add custom rules for credit card validating
    jQuery.validator.addMethod("cardNumber", Stripe.validateCardNumber, "Please enter a valid card number");
    jQuery.validator.addMethod("cardCVC", Stripe.validateCVC, "Please enter a valid security code");
    jQuery.validator.addMethod("cardExpiry", function() {
    return Stripe.validateExpiry($(".card-expiry-month").val(),
    $(".card-expiry-year").val())
    }, "Please enter a valid expiration");

    // We use the jQuery validate plugin to validate required params on submit
    $("#example-form").validate({
    submitHandler: submit,
    rules: {
    "card-cvc" : {
    cardCVC: true,
    required: true
    },
    "card-number" : {
    cardNumber: true,
    required: true
    },
    "card-expiry-year" : "cardExpiry" // we don't validate month separately
    }
    });

    // adding the input field names is the last step, in case an earlier step errors
    addInputNames();
    return false; //submit only from callback
    })
    });
    </script>
    </head>
    <body>

    <h1>Stripe Example Form</h1>

    <form action="/" method="post" id="example-form" style="display: none;">
    <h1>Charge $10 with Stripe</h1>

    <!-- to display errors returned by createToken -->
    <span class="payment-errors"></span>

    <form action="" method="post" id="example-form"> {% csrf_token %}
    <div class="form-row">
    <label for="name" class="stripeLabel">Your Name</label>
    <input type="text" name="name" class="required" />
    </div>

    <div class="form-row">
    <label for="email">E-mail Address</label>
    <input type="text" name="email" class="required" />
    </div>

    </div>

    <div class="form-row">
    <label>Card Number</label>
    <input type="text" maxlength="20" autocomplete="off" class="card-number stripe-sensitive required" />
    </div>

    <div class="form-row">
    <label>CVC</label>
    <input type="text" maxlength="4" autocomplete="off" class="card-cvc stripe-sensitive required" />
    </div>

    <div class="form-row">
    <label>Expiration</label>
    <div class="expiry-wrapper">
    <select class="card-expiry-month stripe-sensitive required">
    </select>
    <script type="text/javascript">
    var select = $(".card-expiry-month"),
    month = new Date().getMonth() + 1;
    //populate the expiration month dropdown
    var select = $(".card-expiry-month");
    for (var i = 1; i <= 12; i++) {
    select.append($("<option value='"+i+"' "+(month === i ? "selected" : "")+">"+i+"</option>"))
    select.append($("<option value='"+i+"'>"+i+"</option>"))
    }
    </script>
    <span> / </span>
    <select class="card-expiry-year stripe-sensitive required"></select>
    <script type="text/javascript">
    var select = $(".card-expiry-year"),
    year = new Date().getFullYear();

    for (var i = 0; i < 12; i++) {
    for (var i = 1; i < 10; i++) {
    select.append($("<option value='"+(i + year)+"' "+(i === 0 ? "selected" : "")+">"+(i + year)+"</option>"))
    }
    </script>
    </div>
    </div>

    <button type="submit" name="submit-button">Submit</button>
    <span class="payment-errors"></span>
    <button type="submit" class="submit-button">Submit Payment</button>
    </form>

    <!--
    The easiest way to indicate that the form requires JavaScript is to show
    the form with JavaScript (otherwise it will not render). You can add a
    helpful message in a noscript to indicate that users should enable JS.
    -->
    <script>if (window.Stripe) $("#example-form").show()</script>
    <noscript><p>JavaScript is required for the registration form.</p></noscript>

    </body>
    </html>
    </html>
  24. Saikat Chakrabarti revised this gist Aug 8, 2011. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions gistfile1.html
    View file
    Original file line number Diff line number Diff line change
    @@ -4,8 +4,8 @@
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <title>Stripe Sample Form</title>

    <script type="text/javascript" src="/jquery.min.js"></script>
    <script type="text/javascript" src="/jquery.validate.js"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    <script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.8.1/jquery.validate.min.js"></script>
    <script type="text/javascript" src="https://js.stripe.com/v1/"></script>
    <script type="text/javascript">
    Stripe.setPublishableKey('pk_YOUR_PUBLISHABLE_KEY');
  25. Saikat Chakrabarti revised this gist Jul 22, 2011. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion gistfile1.html
    View file
    Original file line number Diff line number Diff line change
    @@ -50,7 +50,7 @@
    addInputNames();
    } else {
    // token contains id, last4, and card type
    var token = response['token'];
    var token = response['id'];

    // insert the stripe token
    var input = $("<input name='stripeToken' value='" + token + "' style='display:none;' />");
  26. Saikat Chakrabarti revised this gist Jul 18, 2011. 1 changed file with 0 additions and 1 deletion.
    1 change: 0 additions & 1 deletion gistfile1.html
    View file
    Original file line number Diff line number Diff line change
    @@ -133,7 +133,6 @@ <h1>Stripe Example Form</h1>
    </script>
    <span> / </span>
    <select class="card-expiry-year stripe-sensitive required"></select>
    </select>
    <script type="text/javascript">
    var select = $(".card-expiry-year"),
    year = new Date().getFullYear();
  27. Saikat Chakrabarti revised this gist Jul 15, 2011. 1 changed file with 6 additions and 7 deletions.
    13 changes: 6 additions & 7 deletions gistfile1.html
    View file
    Original file line number Diff line number Diff line change
    @@ -34,16 +34,15 @@
    $(form['submit-button']).attr("disabled", "disabled")

    Stripe.createToken({
    number: $('.card-number').val(),
    cvc: $('.card-cvc').val(),
    exp_month: $('.card-expiry-month').val(),
    exp_year: $('.card-expiry-year').val()
    }, 100, function(status, response) {

    number: $('.card-number').val(),
    cvc: $('.card-cvc').val(),
    exp_month: $('.card-expiry-month').val(),
    exp_year: $('.card-expiry-year').val()
    }, 100, function(status, response) {
    if (response.error) {
    // re-enable the submit button
    $(form['submit-button']).removeAttr("disabled")

    // show the error
    $(".payment-errors").html(response.error.message);

  28. Saikat Chakrabarti created this gist Jul 15, 2011.
    162 changes: 162 additions & 0 deletions gistfile1.html
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,162 @@
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <title>Stripe Sample Form</title>

    <script type="text/javascript" src="/jquery.min.js"></script>
    <script type="text/javascript" src="/jquery.validate.js"></script>
    <script type="text/javascript" src="https://js.stripe.com/v1/"></script>
    <script type="text/javascript">
    Stripe.setPublishableKey('pk_YOUR_PUBLISHABLE_KEY');
    $(document).ready(function() {
    function addInputNames() {
    // Not ideal, but jQuery's validate plugin requires fields to have names
    // so we add them at the last possible minute, in case any javascript
    // exceptions have caused other parts of the script to fail.
    $(".card-number").attr("name", "card-number")
    $(".card-cvc").attr("name", "card-cvc")
    $(".card-expiry-year").attr("name", "card-expiry-year")
    }

    function removeInputNames() {
    $(".card-number").removeAttr("name")
    $(".card-cvc").removeAttr("name")
    $(".card-expiry-year").removeAttr("name")
    }

    function submit(form) {
    // remove the input field names for security
    // we do this *before* anything else which might throw an exception
    removeInputNames(); // THIS IS IMPORTANT!

    // given a valid form, submit the payment details to stripe
    $(form['submit-button']).attr("disabled", "disabled")

    Stripe.createToken({
    number: $('.card-number').val(),
    cvc: $('.card-cvc').val(),
    exp_month: $('.card-expiry-month').val(),
    exp_year: $('.card-expiry-year').val()
    }, 100, function(status, response) {

    if (response.error) {
    // re-enable the submit button
    $(form['submit-button']).removeAttr("disabled")

    // show the error
    $(".payment-errors").html(response.error.message);

    // we add these names back in so we can revalidate properly
    addInputNames();
    } else {
    // token contains id, last4, and card type
    var token = response['token'];

    // insert the stripe token
    var input = $("<input name='stripeToken' value='" + token + "' style='display:none;' />");
    form.appendChild(input[0])

    // and submit
    form.submit();
    }
    });

    return false;
    }

    // add custom rules for credit card validating
    jQuery.validator.addMethod("cardNumber", Stripe.validateCardNumber, "Please enter a valid card number");
    jQuery.validator.addMethod("cardCVC", Stripe.validateCVC, "Please enter a valid security code");
    jQuery.validator.addMethod("cardExpiry", function() {
    return Stripe.validateExpiry($(".card-expiry-month").val(),
    $(".card-expiry-year").val())
    }, "Please enter a valid expiration");

    // We use the jQuery validate plugin to validate required params on submit
    $("#example-form").validate({
    submitHandler: submit,
    rules: {
    "card-cvc" : {
    cardCVC: true,
    required: true
    },
    "card-number" : {
    cardNumber: true,
    required: true
    },
    "card-expiry-year" : "cardExpiry" // we don't validate month separately
    }
    });

    // adding the input field names is the last step, in case an earlier step errors
    addInputNames();
    });
    </script>
    </head>
    <body>

    <h1>Stripe Example Form</h1>

    <form action="/" method="post" id="example-form" style="display: none;">

    <div class="form-row">
    <label for="name" class="stripeLabel">Your Name</label>
    <input type="text" name="name" class="required" />
    </div>

    <div class="form-row">
    <label for="email">E-mail Address</label>
    <input type="text" name="email" class="required" />
    </div>

    <div class="form-row">
    <label>Card Number</label>
    <input type="text" maxlength="20" autocomplete="off" class="card-number stripe-sensitive required" />
    </div>

    <div class="form-row">
    <label>CVC</label>
    <input type="text" maxlength="4" autocomplete="off" class="card-cvc stripe-sensitive required" />
    </div>

    <div class="form-row">
    <label>Expiration</label>
    <div class="expiry-wrapper">
    <select class="card-expiry-month stripe-sensitive required">
    </select>
    <script type="text/javascript">
    var select = $(".card-expiry-month"),
    month = new Date().getMonth() + 1;
    for (var i = 1; i <= 12; i++) {
    select.append($("<option value='"+i+"' "+(month === i ? "selected" : "")+">"+i+"</option>"))
    }
    </script>
    <span> / </span>
    <select class="card-expiry-year stripe-sensitive required"></select>
    </select>
    <script type="text/javascript">
    var select = $(".card-expiry-year"),
    year = new Date().getFullYear();

    for (var i = 0; i < 12; i++) {
    select.append($("<option value='"+(i + year)+"' "+(i === 0 ? "selected" : "")+">"+(i + year)+"</option>"))
    }
    </script>
    </div>
    </div>

    <button type="submit" name="submit-button">Submit</button>
    <span class="payment-errors"></span>
    </form>

    <!--
    The easiest way to indicate that the form requires JavaScript is to show
    the form with JavaScript (otherwise it will not render). You can add a
    helpful message in a noscript to indicate that users should enable JS.
    -->
    <script>if (window.Stripe) $("#example-form").show()</script>
    <noscript><p>JavaScript is required for the registration form.</p></noscript>

    </body>
    </html>