Files

campaign.html.erb

<section id="new_subscriber">
  <div class="payment-errors">  </div>
  <%= form_for @subscriber, :url => campaign_subscribers_path(@campaign) do |f| %>

    <%= f.hidden_field :campaign_id, :value => @campaign.id %>
    <%= f.fields_for :stripe_customer do |s| %>
      <%= s.hidden_field :stripe_token %>
    <% end %>

    <ul>
      <li>
        <%= f.label :phone %> (standard text message rates will apply)
        <%= f.text_field :phone %>
      </li>
      <li>
        <%= f.label :email %>
        <%= f.text_field :email %>

      </li>
      <li>
        <label>Card Number</label>
        <input type="text" size="20" autocomplete="off" class="card-number"/>
      </li>
      <li>
        <label>CVC</label>
        <input type="text" size="4" autocomplete="off" class="card-cvc"/>
      </li>
      <li>
        <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"/>
      </li>
      <li>
        <%= f.submit "Sign Up", :class => "submit-button" %>
      </li>
    </ul>
  <% end %>
</section>

campaigns.js.coffee

$(document).ready ->
  $("#new_subscriber").submit (event) ->
    $(".payment-errors").html "Checking card"
    # disable the submit button to prevent repeated clicks
    $(".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()
      , 0, stripeResponseHandler
    false

  stripeResponseHandler = (status, response) ->
    $(".payment-errors").html "Got response"
    if response.error
      $('.submit-button').removeAttr("disabled");
      $(".payment-errors").html response.error.message
    else
      form = $("#new_subscriber")
      token = response["id"]
      $(".payment-errors").html "Valid token #{token}"
      $("#subscriber_stripe_customer_attributes_stripe_token").val(token)
      form.get(0).submit()