Add New Subscription. This is broken code, so please do not use it for a Stripe.com implementation. It's here for reference purposes only.

addOrder.js

Stripe.setPublishableKey('pk_test_Wfzrj4uDDPOcv7XxVJKXRERS');

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$ = $("form#addservice-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 + "' />");
      alert(token);
      // and submit
      form$.get(0).submit();
  }
}

// Add new service stuff.
  $('button#addservice-submit').click(function() {
    var $form = $('form#addservice-form');
    var chargeAmount = 1499;
    var l = Ladda.create( document.querySelector( '#addservice-submit' ) );
    l.start();
    //Get the data from all the fields
    var data = $("#addservice-form").serialize();
    
    //start the ajax
    $.ajax({
      //this is the php file that processes the data and send mail
      url: "/addService.php", 
      
      //GET method is used
      type: "POST",

      //pass the data     
      data: data,   
      
      //Do not cache the page
      cache: false,
      
      //success
      success: function (html) {
        l.stop();     
        //if process.php returned 1/true (send mail success)
        if (html=="good") {         
          //hide the form
          $('#serviceNameExists').hide();
          $('#notComplete').hide();
          $('#serviceAdded').show();
          Stripe.createToken({
            number: $('#thecard').val(),
            cvc: $('#thecvc').val(),
            exp_month: $('#themonth').val(),
            exp_year: $('#theyear').val()
          }, chargeAmount, stripeResponseHandler);
        } else if (html=="notComplete") {
          $('#serviceAdded').hide();
          $('#serviceNameExists').hide();
          $('#notComplete').show();
        } else if (html=="serviceNameExists") {
          $('#serviceAdded').hide();
          $('#notComplete').hide();
          $('#serviceNameExists').show();
        } else alert(html);       
      }   
    });
    return false;
  });

form.html

<form action="javascript:" method="POST" id="addservice-form">
    <label>Service Name</label>
    <input type="text" name="servicename" class="span3">
    <label>API URL</label>
    <input type="text" name="apiurl" class="span3">
    <label>API Key</label>
    <input type="text" name="apikey" class="span3">
    <label>API Hash</label>
    <input type="text" name="apihash" class="span3">
    <label>Allowed IP's (comma separated list)</label>
    <input type="text" name="allowedip" class="span3">
    <label>Desired Status URL</label>
    <div class="input-append">
      <input type="text" name="domain" class="span2" id="appendedInput">
      <span class="add-on">.yourdomain.us</span>
    </div>
    <label>Credit Card #</label>
    <input type="text" data-stripe="number" id="thecard" placeholder="Card Number (eg: 1111222233334444)">
    <label>Security Code</label>
    <input type="text" data-stripe="cvc" id="thecvc" placeholder="CVC Code/Security Code (eg: 112)">
    <label>Expiration Month</label>
    <input type="text" data-stripe="exp-month" id="themonth" placeholder="Expiration Month (eg: 05)">
    <label>Expiration Year</label>
    <input type="text" data-stripe="exp-year" id="theyear" placeholder="Expiration Year (eg: 2013)">

    <center><button type="submit" class="ladda-button btn btn-primary" data-style="expand-right" id="addservice-submit"><span class="ladda-label">Add Service</span><span class="ladda-spinner"></span></button></center>
    <div class="clearfix"></div>
</form>