Stripe::InvalidRequestError (This customer has no attached payment source Rails 4

Question

I've been receiving this error all day while trying to test customer accounts. Can you show me a way to get past it. I will post the contents of my subscriptions controller and routes.rb below.

Subscriptions_controller.rb

class SubscriptionsController < ApplicationController
  before_filter :authenticate_user!, except: [:new]
  before_action :redirect_to_signup, only: [:new]

  def show

  end

  def new
    @subscription = current_user.subscription
    if @subscription.active
      @stripe_customer = Stripe::Customer.retrieve(@subscription.stripe_user_id)
      @stripe_subscription = @stripe_customer.first
    end
  end

  def create
    token = params[:stripeToken]
    customer = Stripe::Customer.create(
           source: token,
           plan: "gbsubscriptionlevel1",
           email: current_user.email
    )

    current_user.subscription.stripe_user_id = customer.id
    current_user.subscription.active = true
    current_user.subscription.save

    redirect_to users_index_path
  end

  def destroy

  end

  private
  def redirect_to_signup
    if !user_signed_in?
      session["user_return_to"] = new_subscription_path
      redirect_to new_user_registration_path
    end
  end
end

_Stripe_form.html.erb

<div class="container">
  <%= form_tag subscription_path, id: 'payment-form' do %>
  <form action="/subscription" method="POST" id="payment-form">
    <span class="payment-errors"></span>

    <div class="row">
      <div class="col-xs-4">
        <label>
          <span>Card Number</span>
          <input value="4242 4242 4242 4242" class="form-control" type="text" size="20" data-stripe="number"/>
        </label>
      </div>
    </div>

    <div class="row">
      <div class="col-xs-1">
        <label>
          <span>CVC</span>
          <input value="123" class="form-control" type="text" size="4" data-stripe="cvc"/>
        </label>
      </div>
    </div>

    <div class="row">
      <div class="col-xs-1">
        <label>MM</label>
        <input value="12" class="form-control" type="text" size="2" data-stripe="exp-month" placeholder="01"/>
      </div>
      <div class="col-xs-1">
        <label>YYYY</label>
        <input value="2019" class="form-control" type="text" size="3" data-stripe="exp-year" placeholder="2020"/>
      </div>
    </div>

    <div class="row">
      <div class="col-xs-1">
        <br/>
        <button class="btn btn-primary-outline" type="submit">Create Subscription</button>
      </div>
    </div>
  </form>
  <% end %>
</div>

Routes.rb

resource :subscriptions

subscription.js.coffee

jQuery ->
  Stripe.setPublishableKey($("meta[name='stripe-key']").attr("content"))

  $('#payment-form').submit (event) ->
    $form = $(this)
    # Disable the submit button to prevent repeated clicks
    $form.find('button').prop 'disabled', true
    Stripe.card.createToken $form, stripeResponseHandler
    # Prevent the form from submitting with the default action
    false

stripeResponseHandler = (status, response) ->
  $form = $('#payment-form')
  if response.error
# Show the errors on the form
    $form.find('.payment-errors').text response.error.message
    $form.find('button').prop 'disabled', false
  else
# response contains id and card, which contains additional card details
    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()
  return

Server Log/Stacktrace

Started POST "/subscriptions" for 127.0.0.1 at 2016-02-10 20:24:22 -0500
Processing by SubscriptionsController#create as HTML
  Parameters: {"utf8"=>"✓", "authenticity_token"=>"B7ErmlwhWi4unI+r6um3MbZjPwfixfAXi4SiHpOrTUXphOh9kt07cEbC5CuuodrrIDRx4/L05l3VkgS6r+tKGA=="}
  User Load (1.0ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = ?  ORDER BY "users"."id" ASC LIMIT 1  [["id", 5]]
Completed 500 Internal Server Error in 1119ms (ActiveRecord: 1.0ms)

Stripe::InvalidRequestError (This customer has no attached payment source):
  app/controllers/subscriptions_controller.rb:19:in `create'


  Rendered C:/Ruby217/Ruby21/lib/ruby/gems/2.1.0/gems/actionpack-4.2.3/lib/action_dispatch/middleware/templates/rescues/_source.erb (1.0ms)
  Rendered C:/Ruby217/Ruby21/lib/ruby/gems/2.1.0/gems/actionpack-4.2.3/lib/action_dispatch/middleware/templates/rescues/_trace.html.erb (4.0ms)
  Rendered C:/Ruby217/Ruby21/lib/ruby/gems/2.1.0/gems/actionpack-4.2.3/lib/action_dispatch/middleware/templates/rescues/_request_and_response.html.erb (1.0ms)
  Rendered C:/Ruby217/Ruby21/lib/ruby/gems/2.1.0/gems/actionpack-4.2.3/lib/action_dispatch/middleware/templates/rescues/diagnostics.html.erb within rescues/layout (55.0ms)
  Rendered C:/Ruby217/Ruby21/lib/ruby/gems/2.1.0/gems/web-console-2.3.0/lib/web_console/templates/_markup.html.erb (1.0ms)
  Rendered C:/Ruby217/Ruby21/lib/ruby/gems/2.1.0/gems/web-console-2.3.0/lib/web_console/templates/_inner_console_markup.html.erb within layouts/inlined_string (1.0ms)
  Rendered C:/Ruby217/Ruby21/lib/ruby/gems/2.1.0/gems/web-console-2.3.0/lib/web_console/templates/_prompt_box_markup.html.erb within layouts/inlined_string (0.0ms)
  Rendered C:/Ruby217/Ruby21/lib/ruby/gems/2.1.0/gems/web-console-2.3.0/lib/web_console/templates/style.css.erb within layouts/inlined_string (0.0ms)
  Rendered C:/Ruby217/Ruby21/lib/ruby/gems/2.1.0/gems/web-console-2.3.0/lib/web_console/templates/console.js.erb within layouts/javascript (58.0ms)
  Rendered C:/Ruby217/Ruby21/lib/ruby/gems/2.1.0/gems/web-console-2.3.0/lib/web_console/templates/main.js.erb within layouts/javascript (1.0ms)
  Rendered C:/Ruby217/Ruby21/lib/ruby/gems/2.1.0/gems/web-console-2.3.0/lib/web_console/templates/error_page.js.erb within layouts/javascript (0.0ms)
  Rendered C:/Ruby217/Ruby21/lib/ruby/gems/2.1.0/gems/web-console-2.3.0/lib/web_console/templates/index.html.erb (129.1ms)

Breakpoint on request for form

 <h2 style="margin-top: 30px">Request</h2>

    <p><b>Parameters</b>:</p>
<pre>{"utf8"=>"✓",
 "authenticity_token"=>"0WVA1LNXqv97iQ47UYgitLTiAQQxOGfAl/YatYy/CXM/UIMzfavLoRPXZbsVwE9uIrVP4CEJcYrJ4LwRsP8OLg=="}</pre>
    <div class="details">
        <div class="summary"><a href="#" onclick="return toggleSessionDump()">Toggle session dump</a></div>
        <div id="session_dump" style="display:none">
<pre>_csrf_token: "7jXD5878YV5oXmuAREht2pZXTuQQMRZKXhampDxAB10="
session_id: "c9c8419f0e529507fc786aa8241044bf"
warden.user.user.key: [[5], "$2a$10$BbVveau77t6o1fJOMKxiFO"]</pre>
        </div>
    </div>
    <div class="details">
        <div class="summary"><a href="#" onclick="return toggleEnvDump()">Toggle env dump</a></div>
        <div id="env_dump" style="display:none">
<pre>GATEWAY_INTERFACE: "CGI/1.2"
HTTP_ACCEPT: "text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8"
HTTP_ACCEPT_ENCODING: "gzip, deflate"
HTTP_ACCEPT_LANGUAGE: "en-US,en;q=0.8"
HTTP_CACHE_CONTROL: "max-age=0"
REMOTE_ADDR: "127.0.0.1"
SERVER_NAME: "127.0.0.1"
SERVER_PROTOCOL: "HTTP/1.1"</pre>
        </div>
    </div>
    <h2 style="margin-top: 30px">Response</h2>

    <p><b>Headers</b>:</p>
    <pre>None</pre>
</div>
<div id="console" data-mount-point="/__web_console" data-session-id="ac2f197d51af2911171590df30f981c7"
     data-prompt-label=">> " class=" console">
    <div class="resizer layer pos-absolute border-box"></div>
    <div class="console-outer layer pos-absolute border-box">
        <div class="console-actions pos-fixed pos-right">
            <div class="close-button button border-box" title="close">x</div>
        </div>
        <div class="console-inner">
            <div class="console-prompt-box"><span class="console-prompt-label">>> </span>
                <pre class="console-prompt-display"><span class="console-cursor"> </span></pre>
            </div>
        </div>
    </div>

Answer 1

After a day of searching. I found the answer.

The version of jquery that's on the page is 1.3.2 which .prop isn't available for which is the reason for this error.

If you don't want to upgrade your version of jquery you can replace .prop with .attr :

$form.find('button').prop('disabled', true);

becomes:

$form.find('button').attr('disabled', true);

Let me know if that helps.