Jquery 轨道4+；条纹&x2B；简单形式+；发送到服务器两次

我正在开发RoR4应用程序，使用户可以使用Stripe帐户购买订阅。这在某种程度上是可行的，但问题是表单提交了两次，一次没有令牌，然后有令牌

我的应用程序代码的灵感来源于这篇博客文章，但我使用的是简单的表单：

我在stackoverflow post-Date（jQuery回调调用了两次）中看到了类似的问题，但建议的解决方案并没有解决这个问题

咖啡脚本

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

order =
  setupForm: ->
    $j('#form').submit (ev) ->
      ev.preventDefault()
      if $j('#order_stripe_card_token').val
        order.processCard()
      $j('input[type=submit]').attr('disabled', true)
    else
      $j('#stripe_error').text('Credit Card Number should not be empty!')

  processCard: ->
    card =
      number:   $j('#order_credit_card_number').val()
      cvc:      $j('#order_cvc').val()
      expMonth: $j('#order_month').val()
      expYear:  $j('#order_year').val()
    Stripe.createToken(card, order.handleStripeResponse)

  handleStripeResponse: (status, response) ->
    if status == 200 and response.id.length
      $j('#order_stripe_card_token').val(response.id)
      $j('#order_credit_card_number').val('')
      $j('#order_cvc').val('')
      $j('#order_month').val('')
      $j('#order_year').val('')
      $j('#form')[0].submit()
    else
      $j('#stripe_error').text(response.error.message)
      $j('#stripe_error').show()
      $j('input[type=submit]').attr('disabled', false)

服务器跟踪

Started POST "/url" for 10.0.2.2 at 2015-12-03 03:26:35 +0000
Processing by OrdersController#order_form as HTML
  Parameters: {"utf8"=>"✓", "authenticity_token"=>"zpV3WsGPbK8DUX3gIzwHCc1/7hVlxtLVp0MfX+Y+hfc=", "order"=> {"stripe_card_token"=>"", "credit_card_number"=>"4242424242424242", "cvc"=>"999", "month"=>"09", "year"=>"2017"}}
User Load (7.1ms)  SELECT  "users".* FROM "users"  WHERE "users"."id" = 151  ORDER BY "users"."id" ASC LIMIT 1
Redirected to http://localhost:3000/url
Completed 302 Found in 31ms (ActiveRecord: 7.1ms)

Started GET "/url" for 10.0.2.2 at 2015-12-03 03:26:36 +0000
Processing by OrdersController#form as HTML
User Load (0.6ms)  SELECT  "users".* FROM "users"  WHERE "users"."id" = 151  ORDER BY "users"."id" ASC LIMIT 1
Answer Load (0.4ms)  SELECT  "answers".* FROM "answers"  WHERE "answers"."user_id" = $1  ORDER BY "answers"."id" ASC LIMIT 1  [["user_id", 151]]
Address Load (0.4ms)  SELECT  "addresses".* FROM "addresses"  WHERE "addresses"."user_id" = $1 AND "addresses"."address_type" = 'shipping'  ORDER BY "addresses"."id" ASC LIMIT 1  [["user_id", 151]]

Started POST "/url" for 10.0.2.2 at 2015-12-03 03:26:36 +0000
  Rendered shared/_form_shipping_address.html.erb (41.6ms)
  Rendered orders/form.html.erb within layouts/application (241.2ms)
  Rendered layouts/_navigation_links.html.erb (2.2ms)
  Rendered layouts/_navigation.html.erb (38.7ms)
Processing by OrdersController#order_form as HTML
  Parameters: {"utf8"=>"✓", "authenticity_token"=>"zpV3WsGPbK8DUX3gIzwHCc1/7hVlxtLVp0MfX+Y+hfc=", "order"=>{"stripe_card_token"=>"tok_17DnjP4Ul2QFXvJREw0BigSa", "credit_card_number"=>"", "cvc"=>"", "month"=>"", "year"=>""}}

order.html.erb

<%= simple_form_for @order,
    :url => order_url_path,
    :method => 'post',
    :html => { :id => 'form' } do |f| %>

      <%= field_set_tag 'Contact Information' do %>
        <%= f.input :first_name, required: true, wrapper_html: { class: 'form-group' }, :input_html => { class: 'form-control', 'value' => @user.name } %>
        <%= f.input :last_name, required: true, wrapper_html: { class: 'form-group' }, :input_html => { class: 'form-control', 'value' => @user.last_name } %>
        <%= f.input :user_phone, required: true, wrapper_html: { class: 'form-group' }, :label => 'Phone Number', :input_html => { class: 'form-control', 'value' => @user.phone } %>
      <% end %>

    <%= render "shared/form_shipping_address", f: f %>

    <%= field_set_tag 'Credit Card' do %>
      <span id="stripe_error"></span><br>
      <%= f.hidden_field :stripe_card_token %>
      <%= f.input :credit_card_number, required: true, wrapper_html: { class: 'form-group' }, :label => 'Credit Card Number', :input_html => { class: 'form-control' }, :placeholder => 'xxxx-xxxx-xxxx-xxxx' %>
      <%= f.input :cvc, required: true, wrapper_html: { class: 'form-group' }, :label => 'CVC', :input_html => { class: 'form-control' }, :placeholder => 'xxx' %>
      <%= f.input :month, required: true, wrapper_html: { class: 'form-group' }, :label => 'Month', :input_html => { class: 'form-control' }, :placeholder => 'MM' %>
      <%= f.input :year, required: true, wrapper_html: { class: 'form-group' }, :label => 'Year', :input_html => { class: 'form-control' }, :placeholder => 'YYYY' %>
    <% end %>

    <%= f.submit 'Place your order', :class => 'btn btn-primary btn-large' %>

order\u url\u路径，
：method=>“post”，
：html=>{:id=>'form'}do | f |%>
{class:'表单控件'，'值'=>@user.name}%>
{class:'form control'，'value'=>@user.last_name}%>
'Phone Number'，：input_html=>{class:'form control'，'value'=>@user.Phone}%>


'信用卡号'，：input_html=>{class:'form control'}，：占位符=>'xxxx xxxx xxxx%%>
'CVC'，：input_html=>{class:'form control'}，：placeholder=>'xxx'>
'Month'，：input_html=>{class:'form control'}，：placeholder=>'MM'>
'Year'，：input_html=>{class:'form control'}，：placeholder=>'YYYY'>
“btn btn主btn大”%>

---

如何避免表单两次提交到服务器（为什么会发生这种情况）

如果您在项目中包含了jquery，并且意外地包含了两次，那么这可能就是问题的原因

我认为这不是问题所在。在我的应用程序中，我有一个页面，允许用户更新她的信用卡，并且服务器被调用一次，使用令牌。