简体   繁体   English

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

[英]Rails remote delete and update view through Ajax

In the past, whenever I wanted to update a part of my view through Ajax, I've done the following:过去,每当我想通过 Ajax 更新视图的一部分时,我都会执行以下操作:

  1. create a partial out of the part I want to update and give it a unique ID, say #tracks从我想要更新的部分中创建一个部分,并给它一个唯一的 ID,比如#tracks
  2. create a special action in the controller for that Ajax call, say remove_track that updates all the values, etc. and add format.js在控制器中为该 Ajax 调用创建一个特殊操作,例如remove_track更新所有值等并添加format.js
  3. create a new JS file with the same name as the action so Rails calls it automatically remove_track.js.erb which contains something like: $('#tracks').html("<%=j render 'cds/show_tracks' %>");创建一个与操作同名的新 JS 文件,以便 Rails 自动调用它remove_track.js.erb ,其中包含如下内容: $('#tracks').html("<%=j render 'cds/show_tracks' %>");
  4. set remote: true in the link that calls this action.在调用此操作的链接中设置remote: true

All this is fine, but now I am trying to delete and update a common index view using the regular destroy method for flexibility, meaning I can call this method either through Ajax or normally.所有这一切都很好,但现在我正尝试使用常规的destroy方法来删除和更新公共index视图以获得灵活性,这意味着我可以通过 Ajax 或正常调用此方法。 I figured it's such a common thing to do that there has to be a better way than all of the above.我认为这是一件很常见的事情,必须有比上述所有方法更好的方法。

I can get the destroy method to call my destroy.js.erb file by simply putting this into the controller:我可以通过简单地将其放入控制器来获取 destroy 方法来调用我的destroy.js.erb文件:

  format.js { layout: false }

and of course setting remote: true on the link.当然,在链接上设置remote: true

what I cannot do is get the view to refresh.我不能做的是让视图刷新。 The table I want to refresh is encased in a div with a unique ID, but since it's not a partial, it refuses to refresh the content.我要刷新的表被封装在一个具有唯一 ID 的 div 中,但由于它不是局部的,因此它拒绝刷新内容。 Maybe I'm missing something.也许我错过了一些东西。

Am I doomed to have to create a partial and refresh it with the method above or is there a more magical way of doing it (other than using Turbolinks)?我注定要创建一个部分并使用上述方法刷新它,还是有更神奇的方法(除了使用 Turbolinks)?

Thanks.谢谢。

PS Also, I just noticed this has the added disadvantage that I cannot pass the rest of the params to the destroy method since it only passes the object ID to destroy using the regular CRUD routes. PS另外,我刚刚注意到这有一个额外的缺点,即我无法将其余的参数传递给 destroy 方法,因为它只传递对象 ID 以使用常规 CRUD 路由进行销毁。 If I try to use platform(action: destroy) or platform(method: delete) I get an error:如果我尝试使用platform(action: destroy)platform(method: delete)我会收到错误消息:

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

Which means I have to create a new route if I want to pass those parameters...这意味着如果我想传递这些参数,我必须创建一个新路由......

Yet another disadvantage to all this is that I'm repeading all the logic for searches and sorting that I have in the index method again in the destroy method.所有这一切的另一个缺点是,我在销毁方法中再次重复了索引方法中的所有搜索和排序逻辑。 I am certain this is definitely not the way to do it.我确定这绝对不是这样做的方法。

Thanks to this page I found the proper way to do it.感谢这个页面,我找到了正确的方法。 So simple and effective.如此简单有效。

http://carmennorahgraydean.blogspot.com.es/2012/10/rails-328-ajax-super-basic-example.html http://carmennorahgraydean.blogspot.com.es/2012/10/rails-328-ajax-super-basic-example.html

Update your destroy line in index.html.erb:更新 index.html.erb 中的 destroy 行:

 <%= 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).创建一个文件,destroy.js.erb,把它放在你的其他 .erb 文件旁边(在 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:将 format.js { render :layout => false } 添加到您的控制器:

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

Hope this helps someone else.希望这对其他人有帮助。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM