Rails remote delete and update view through Ajax

Question

In the past, whenever I wanted to update a part of my view through Ajax, I've done the following:

1. create a partial out of the part I want to update and give it a unique ID, say #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
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' %>");
4. set remote: true in the link that calls this action.

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. 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:

  format.js { layout: false }

and of course setting remote: true on the link.

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. 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)?

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. If I try to use platform(action: destroy) or platform(method: delete) I get an error:

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.

Answer 1

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

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

Hope this helps someone else.