Question

在我的主form_for我有一个form_tag的模式，允许用户在其帐户中添加新的信用卡。这个form_tag有remote: true，因此请求可以作为Ajax转到CardsController，其中成功呈现关闭模式的模板并将新卡信息添加到现有的卡列表中主要形式。

问题是请求以HTML格式传递给控制器。这里有很多关于这个的帖子，但没有一个提供适合我的答案。我正在使用Google Chrome进行调试，在“网络”标签中，我看到了这一点：

Chrome 'Network'

我不明白1）为什么'type'是'text / html'，因为我已设置remote: true或2）为什么状态为302，我认为这是为了重定向。

可能存在的一个问题是平衡付款balanced.js正在对此表单采取行动，以获取cc信息并生成balanced_card_id，然后将其传递给一组参数控制器。我猜这是302的内容，但我不确定，因为我继承了这个系统并且我不能100％确定平衡支付回调是如何工作的。无论如何，我form_tag的路径是需要xhr请求的控制器。如果我在binding.pry操作的顶部使用CardsController#create，我会看到：

Network 2

balanced.js回调请求的完整网址为ttps://api.balancedpayments.com/jsonp/cards?callback，后跟长字符串。它的请求方法为GET，状态代码为200。响应如下：

{"status":201,"header":{"X-Balanced-Guru":"OHM64f3830e606b11e4ab4502a1fe53e539","Content-Type":"application\/json","x-balanced-host":"bapi-live-prod-7nf6hx-10-3-5-34","x-balanced-software-build":"1.8.39","Content-Length":154,"access-control-allow-origin":"*","access-control-allow-headers":"Content-Type","x-balanced-revision":"1.1","access-control-allow-methods":"POST, OPTIONS","X-Midlr-Version":"2","x-newrelic-app-data":"PxQFWFNXCQYTVVhWAwQDVUYdFhE1AwE2QgNWEVlbQFtcCxYxSBVbDQoZVA4IF0pcXAgEEBhSVhQAQhhQEAMCFlVAFEIIFBQCHVUIUQJUB1tdAwBTUVYLCgBSU04XCAFfSBEUAFVWB1oJW15UClsMC1JVWEMdQVUDCEVSPA=="},"body":"{\n  \"cards\": [\n    {\n      \"href\": \"\/cards\/CC34wrO6NsSYBoVyPM6mTtcC\",\n      \"id\": \"CC34wrO6NsSYBoVyPM6mTtcC\",\n      \"links\": {}\n    }\n  ],\n  \"links\": {}\n}"}
);

控制器用来将卡与id相关联的是该哈希值中的current_user。不知怎的，这个响应变成了我的控制器收到的实际params哈希值，我可以通过使用binding.pry并在控制台中输入params来查看。我明白了：

{"utf8"=>"✓",
 "authenticity_token"=>"HW9/OFAdC373D5L7/yzqKMT2Its2uV31ZxlCe/vQtCU=",
 "balanced_card_id"=>"CC34wrO6NsSYBoVyPM6mTtcC",
 "action"=>"create",
 "controller"=>"money/cards"}

所以我仍然不明白为什么对控制器的原始请求是以HTML格式接收的。

以下是表格：

  = form_tag(money_cards_path, id: 'new-card', remote: true) do
    .modal-header
      %button{ type: "button", class: "close", data: { dismiss: "modal" }}
        %span{ aria: { hidden: "true" }} &times;
        %span.sr-only Close
      %h4.modal-title New Credit Card
    .modal-body
      #errors
      %fieldset
        %p Enter your new credit card information below.
        .row
          .col-sm-8
            = render 'money/cards/form_fields'
    .modal-footer
      = submit_tag "Add Credit Card", class: 'btn btn-success', id: 'new-card-submit', autocomplete: "off"
      .pull-right.cancel
        =link_to 'Cancel', '#', data: { dismiss: "modal" }

这是控制器：

class Money::CardsController < ApplicationController
  before_filter :authenticate_user!

  def create
    @balanced_marketplace = ENV["BALANCED_MARKETPLACE"] #only if it fails and needs to render again

    respond_to do |format|
      if @card = current_user.add_card(params[:balanced_card_id])
        format.html { redirect_to money_root_path, notice: 'Your credit card has been successfully added.' }
        format.js
      else
        format.html { render action: :new, alert: 'Failed to save credit card to your account. Please contact Sweeps for support.' }
        format.js
      end
    end
  end
end

现在我被重定向到money_root_path，因为请求被格式化为HTML。

Answer 1

请确保您的application.js上有这两行：

//= require vendor/jquery (your jQuery path)
//= require jquery_ujs

并在你的gemfile中添加这一行（就在gem＆＃39; rails＆＃39;，＆＃39; 3.x.x＆＃39;之后）：

gem 'jquery-rails'

之后你应该执行：

run bundle install

并重新启动您的服务器。它对我有用！当我有一个元素：remote =＆gt;是的，它是由Ajax发送的。

带有'remote：true'的Rails 3 form_tag作为HTML转到控制器（在Balanced Payments回调之后？）

1 个答案: