Rails form_for :remote=>true 没有调用 js 方法答案

【问题标题】：Rails form_for :remote=>true is not calling js methodRails form_for :remote=>true 没有调用 js 方法
【发布时间】：2010-11-19 17:38:48
【问题描述】：

我不知道为什么这不起作用，我正在学习 rails 并且我正在关注一本书，它说要这样做：

    <%= form_for([@article,@article.comments.new ], :remote=>true, :html => {:style=>'display: none;' }) do |f|%>
    <div class="field">
      <%=    f.label :name %>
      <%=    f.text_field :name %>
    </div>
    <div class="field">
      <%=    f.label :email %>
      <%=    f.text_field :email %>
    </div>
    <div class="field">
      <%=    f.label :body %>
      <%=    f.text_area :body %>
    </div>
    <%= f.submit %>
<% end %>

但是它不起作用，当我在 firebug 中检查请求时，url 没有以 .js 结尾，你有什么想法吗？

【问题讨论】：

可以在这里添加相应的controller-methods (e.g. index, create, new)和相关的视图文件，这样我们就可以看到全貌了吗？

标签： ruby-on-rails ruby-on-rails-3

【解决方案1】：

当你在firebug中查看请求时，仅仅因为url没有以.js结尾，并不意味着它不是从javascript调用的。要验证您是否应该检查请求标头以查看 Accept 参数是什么。如果它说“应用程序/javascript”，那么一切都很好。

其次，开始尝试 :remote => true 时的一个非常常见的问题是，所需的 javascript 库未包含在您的代码中。所以我的猜测是您的布局中缺少以下代码：

<%= javascript_include_tag :defaults %>
<%= csrf_meta_tag %>

如果是这种情况，只需将其包含在布局的 <head> 标记中即可。

【讨论】：

你的意思是“html header”是模板的head标签吗？
是的，谢谢您指出。那不是很清楚。但是，是的，它应该包含在标记中

【解决方案2】：

很可能发生的情况是您缺少 rails.js 文件，无论您使用的是原型还是 jquery，该文件都会为您处理。

如果您使用 jQuery，获取所有所需文件的最简单方法是使用 jquery-rails gem。这将添加一个生成器来安装 jquery 和所需的 rails.js。

在 Rails 应用程序根目录中键入类似内容：

rails g jquery:install

然后，在您的 application.html.erb 中添加该行

<%= javascript_include_tag :defaults %>

或显式（不要忘记单独包含您的 jquery）：

<%= javascript_include_tag :rails, :application %>

[编辑：使用资产管道的 Rails 3.1 或更高版本]

使用jquery-rails gem（如上所述）并将以下几行添加到app/assets/javascripts/application.js（如果它们还没有的话）：

//= require jquery
//= require jquery_ujs

希望这会有所帮助！

【讨论】：

我们遇到了这个问题，但我们添加了jquery_ujs.js 来解决它。
是的，没错，它在 Rails 3.1 和资产管道中发生了一些变化。我更新了我的答案以反映这一点。

【解决方案3】：

检查您的/app/assets/javascript/application.js 文件

它应该包含在下面的文件中。 jquery_ujs 负责工作 remote=> true 功能。

require `jquery`
require `jquery_ujs`

编码愉快！！

【讨论】：

我在chapter 11.2 Iteration F2: Creating an AJAX-Based Cart 上关注Agile Web Development with Rails 时遇到了类似的新手问题。通过在您列出的文件中取消注释 = require jquery 解决了该问题。希望这对其他人有所帮助。
太棒了@cppinitiator！

【解决方案4】：

当您没有添加 jquery_ujs 文件时会出现此错误。您刚刚包含了 jquery 文件。

因此，您需要在视图中手动添加这两个文件，或者在 application.js 或您用于特定 layout 的任何其他文件中要求它们。

根据您的情况，您可以采用第一种或第二种解决方案。

第一种解决方案：

<%= javascript_include_tag :jquery, :jquery_ujs %>

第二个解决方案：

在 app/assets/application.js
中需要 jquery 和 jquery_ujs
```
//= require jquery.js

//= require jquery_ujs
```
在您的特定 layout 文件中包含 application.js 文件。
```
<%= javascript_include_tag :application %>
```

注意：

同时在两个解决方案的布局文件中添加 csrf 标签。

<%= csrf_meta_tag %>

我假设您的 Gemfile 中有以下代码并且已经安装了这个 Gem。

gem 'jquery-rails'

【讨论】：

【解决方案5】：

检查控制器：它是否有一个 respond_to 块？

如果你使用 rails generate scaffold 生成你的应用程序，它会有类似

    respond_to do |format|
      format.html
      format.xml  { .... }
    end

如果确实有，只需取出整个块，从 respond_to 到 end；或者用单行替换整个块

    respond_to :html, :js

或者通过添加此处显示的额外行来编辑块

    respond_to do |format|
      format.html
      format.js
      format.xml  { .... }
    end

两者都应该适用于您的情况。

【讨论】：

【解决方案6】：

如果您有一个 file_field，那么它会以 html 格式提交，即使 remote: true - 我花了很长时间才解决这个问题，所以我添加了这个答案可能会节省其他人的时间，有一个解决方案，使用 remotipart宝石，看答案here

【讨论】：

【解决方案7】：

如果以上答案都没有为您解决问题，请仔细检查您是否没有渲染您的remote: true（或local: false）表单嵌套在页面中的另一个表单中。这给我们带来了问题。

【讨论】：

【解决方案8】：

变化：

[@article,@article.comments.new ]

为

@article

我建议你阅读相关部分的 API：http://api.rubyonrails.org/classes/ActionView/Helpers/FormHelper.html

【讨论】：

ryudice 正在为 ryudice 上的文章寻找一个新的 cmets 表格。 ryudice 的 form_for 调用是 ryudice 想要的正确语法。您的建议适用于标准文章表格。这很令人困惑，因为从未说明上下文。