Skip to content

Instantly share code, notes, and snippets.

@richardjortega
Created October 19, 2012 21:26
Show Gist options
  • Save richardjortega/3920816 to your computer and use it in GitHub Desktop.
Save richardjortega/3920816 to your computer and use it in GitHub Desktop.
Payment page
<!-- to display errors returned by createToken -->
<span class="payment-errors"></span>
<%= form_for @subscription, :html => { :class => 'payment-form', :id => 'payment-form' } do |f| %>
<%= f.hidden_field :stripe_card_token %>
<%= f.hidden_field :last_four %>
<noscript>
<p>This form requires Javascript to use</p>
</noscript>
<!-- these fields are disabled before submission and are never transmitted back to rails -->
<div class="control-group">
<label class="control-label">Name on card</label>
<div class="controls">
<%= text_field_tag :name_on_card %>
</div>
</div>
<div id="credit-card" style="<%= @subscription.last_four ? "display:none" : "display:block" %>">
<div class="control-group">
<label class="control-label">Card Number</label>
<div class="controls">
<%= text_field_tag :credit_card_number, params[:credit_card_number], :class => 'credit-card-number', :disabled => true %>
<span class="help-block">Visa, MasterCard, Discover, AMEX</span>
</div>
</div>
<!-- <div class="control-group">
<label class="control-label">Address</label>
<div class="controls">
<input type="text" placeholder="Street Address" class="input-large">
<input type="text" placeholder="City" class="input-medium">
<input type="text" placeholder="TX" class="input-mini">
<input type="text" placeholder="Zip Code" class="input-small">
</div>
</div> -->
<div class="control-group">
<%= label_tag :expiry_date, 'Expiration', :class => 'control-label' %>
<div class="controls controls-row">
<%= date_select "", :exp_month, {:discard_day => true, :discard_year => true, :use_month_numbers => true, :disabled => true }, {:class => "card-expiry-month"} %>
<%= date_select "", :exp_year, {:discard_month => true, :use_month_numbers => true, :start_year => Date.today.year, :end_year => Date.today.year + 25, :disabled => true }, {:class => "card-expiry-year"} %>
<span class="help-block">Your credit card details will be sent directly to our payment processor</span>
</div>
</div>
<div class="control-group">
<label class="control-label">CVV</label>
<div class="controls">
<%= text_field_tag :cvv, params[:cvv], :class => "card-cvc", :disabled => true %>
<span class="help-block">3 digit number on back of card</span>
</div>
</div>
<div class="control-group">
<label class="control-label">Pick your plan</label>
<div class="controls">
<label class="radio">
<%= radio_button_tag 'plan', 'monthly-plan' %> $30 per month</label>
<label class="radio">
<%= radio_button_tag 'plan', 'yearly-plan' %>
$300 per year</label>
</div>
</div>
</div>
<div class="form-actions">
<%= f.submit "Submit", :class => "btn purple_button" %>
</div>
<% end %><!-- /.payment-form -->
</div><!-- /.span6 -->
</div><!-- /.container -->
@richardjortega
Copy link
Author

rendered html for the radio buttons

<div class="controls">
                            <label class="radio">
                            <input id="plan_monthly-plan" name="plan" type="radio" value="monthly-plan" /> $30 per month</label>
                            <label class="radio">
                            <input id="plan_yearly-plan" name="plan" type="radio" value="yearly-plan" />
                             $300 per year</label>
                        </div>

params output (after post has hit my SubscriptionsController#update action

{"utf8"=>"✓",
"_method"=>"put",
"authenticity_token"=>"RHKtYR2BYIy7tZQUaHCvsKEOw0B7pwU8jQwIkRB49aM=",
"subscription"=>
{"stripe_card_token"=>"tok_0Zxl4ufiRwhWzH", "last_four"=>"4242"},
"name_on_card"=>"Richard Ortega",
"action"=>"update",
"controller"=>"subscriptions",
"id"=>"9"}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment