在rails中调用ajax后页面不显示更新信息答案

【问题标题】：Page does not show updated information after ajax call in rails在rails中调用ajax后页面不显示更新信息
【发布时间】：2012-01-23 19:55:29
【问题描述】：

我有 rails 3.1，当我使用 ajax 进行删除操作时，如果没有手动刷新，页面不会显示更新的内容。

奇怪的是所有 .js.erb 代码似乎都在正常触发。我什至尝试在 destroy.js.erb 中放置一个简单的 page.alert('hi') ，但删除后我没有收到任何警报。我看到几个地方他们提到在视图中为 ajax 添加一个“脚本”标签以使 jquery 工作，但最新的教程都没有提到这一点。感谢您的帮助。

这是我在服务器日志中看到的：

Started DELETE "/categories/35" for 127.0.0.1 at 2011-12-19 12:58:15 -0500
  Processing by CategoriesController#destroy as JS
  Parameters: {"id"=>"35"}
  User Load (0.2ms)  SELECT "users".* FROM "users" WHERE "users"."id" = 5 LIMIT 1
  Category Load (0.3ms)  SELECT "categories".* FROM "categories" WHERE "categories"."user_id" = 5 AND "categories"."id" = ? LIMIT 1  [["id", "35"]]
  SQL (0.5ms)  DELETE FROM "categories" WHERE "categories"."id" = ?  [["id", 35]]
Rendered categories/destroy.js.erb (0.5ms)
Completed 200 OK in 161ms (Views: 30.7ms | ActiveRecord: 3.2ms)

这是我在生成的html页面输出页面源中看到的：

...
 <tr id = "category_35">
    <td>High-end products</td>
    <td class="deletebutton"><a href="/categories/35" data-confirm="Are you sure?" data-method="delete" data-remote="true" rel="nofollow">Delete</a></td>
  </tr>

 <tr id = "category_36">
    <td>Economy products</td>
    <td class="deletebutton"><a href="/categories/36" data-confirm="Are you sure?" data-method="delete" data-remote="true" rel="nofollow">Delete</a></td>
  </tr>

destroy.js.erb的内容：

('#<%= dom_id(@category) %>').fadeOut(700);

在 Gemfile 中：

gem 'jquery-rails'

在 categories_controller.rb 中：

  def index
      @categories = current_user.categories.all
    respond_to do |format|
      format.html # index.html.erb
      format.json 
      format.js
    end
  end

  def destroy
      @category.destroy

    respond_to do |format|
        format.html { redirect_to categories_url }
        format.js { 
            render :template => 'categories/destroy.js.erb', :layout => false 
        }
    end
  end

在 app/views/categories/index.html.erb 中

<h2>Categories</h2>
<table name="categories_list">
<%= render "categories_list" %>
</table>    
<br />

在部分_categories_list.html.erb中

<% @categories.each do |category| %>
  <tr id = "<%= dom_id(category)%>">
    <td><%= category.name %></td>

    <td class="deletebutton"><%= link_to 'Delete', category, confirm: 'Are you sure?', method: :delete, :remote => true  %></td>
  </tr>
<% end %>

【问题讨论】：

你的 ajax 调用是什么样子的
我没有放任何单独的ajax调用代码。我正在使用不引人注目的方法。如您所见，我将 :remote => true 放在删除按钮上。这有帮助吗？
@3nigma，我需要在 application.js 中添加任何设置代码吗？我看到一些旧教程提到了 ajax 设置，但我们是否需要在最新的 rails 3.1 中使用它？
我对rails一无所知，所以不能真正帮助你

标签： jquery ruby-on-rails ajax ruby-on-rails-3 unobtrusive-javascript

【解决方案1】：

好的，以防万一有人偶然发现这个问题，我想分享解决方案。大约有 3 件事很重要：

destroy.js.erb 中的 $ 符号丢失。这是更正后的代码：

$('#').fadeOut(700);
此外，必须指示控制器在响应 .js 时不要使用默认布局。这可以在应用程序控制器本身中完成。但是我在类别控制器中是这样做的：

respond_to 做 |格式| format.html { redirect_to categories_url } 格式.json format.js {render "destroy", :layout => false}
此外，在迭代过程中，我曾一度将 format.json 与 format.js 混淆。他们是两个不同的东西！因为，我是 RoR 的新手，所以我认为对 ajax 调用的响应将是 json 并且 format.json 类似于 format。 js.

最后，我要向 Mark 说一声，他在 github 上分享了一个 ajax 演示： https://github.com/markusproske/ajax_demo/tree/jquery

为了使它对我有用，我必须做的额外更改是禁用布局再现。否则，该演示是彻底的。我仍在研究如何处理 js 调用的错误情况。

【讨论】：