通过Ajax删除和更新Rails远程视图

Question

过去，每当我想通过Ajax更新视图的一部分时，我都会执行以下操作：

1. 将要更新的那部分创建为局部并赋予其唯一的ID，例如 #tracks
2. 在控制器中为该Ajax调用创建一个特殊的操作，例如 remove_track，用于更新所有的值等，并添加 format.js
3. 创建一个与该操作同名的新JS文件，以便Rails自动调用它，例如 remove_track.js.erb，其中包含类似这样的内容：$('#tracks').html("<%=j render 'cds/show_tracks' %>");
4. 在调用此操作的链接中设置 remote: true。

这一切都很好，但现在我正在尝试使用常规的 destroy 方法删除和更新公共的 index 视图，以获取灵活性，也就是说，我可以通过Ajax或正常方式调用此方法。 我想这是一件非常普通的事情，一定有比以上所有方法更好的方法。

我可以通过将下面的内容放入控制器中来使 destroy 方法调用我的 destroy.js.erb 文件：

  format.js { layout: false }

当然还需要在链接上设置remote: true。

我无法让视图刷新。我想要刷新的表格被包含在一个具有唯一ID的 div 中，但由于它不是部分视图，所以它拒绝刷新内容。也许我漏掉了什么。

我必须创建一个部分视图并使用上述方法来刷新它吗？还是有更神奇的方法可以实现（除了使用Turbolinks）？

谢谢。

PS此外，我刚注意到这样做的缺点是我不能将其余的参数传递给销毁方法，因为它只使用常规 CRUD 路由传递对象ID 来销毁。如果我尝试使用platform(action: destroy)或platform(method: delete)，就会出现错误：

No route matches {:action=>"destroy", :controller=>"platforms"}

这意味着如果我想传递这些参数，我必须创建一个新的路由...

但是所有这些的另一个缺点是，我在destroy方法中再次重复了我在index方法中进行搜索和排序的所有逻辑。我确定这绝对不是正确的做法。

- kakubei

Answer 1

感谢这个页面，我找到了正确的做法。非常简单而有效。 http://carmennorahgraydean.blogspot.com.es/2012/10/rails-328-ajax-super-basic-example.html

Update your destroy line in index.html.erb:

<%= link_to 'Destroy', pony, method: :delete, data: { confirm:
'Are you sure?' }, :remote => true, :class => 'delete_pony' %>

Create a file, destroy.js.erb, put it next to your other .erb files (under app/views/ponies). It should look like this:

$('.delete_pony').bind('ajax:success', function() {     
  $(this).closest('tr').fadeOut();
});

Add format.js { render :layout => false } to your controller:

respond_to do |format|
 format.html { redirect_to ponies_url }
 format.json { head :no_content }
 format.js   { render :layout => false }
end

希望这能帮到其他人。

- kakubei

---

非常感谢。这对我来说完美地解决了问题。你应该将其标记为被接受的答案或在答案中写下代码。 - marcamillion

谢谢分享，这真的帮了我很多。外部博客文章有一个讨厌的习惯，就是会消失，所以我编辑了你的答案，包括相关代码，以防万一。 - Stephen Lead