Remove a row from a table (Using AJAX)

Rails
1

I have a table with a number of rows. The right most cell contains a
link ‘Delete’ when this is clicked I’d like that row to be removed from
the table.

How can I achieve this?

The approach I’ve tried is wrapping the whole row in a div then when I
the AJAX returns some HTML to update the div it should return nothing.
Is this the best way? Any suggestions?

2

Matthew Planchant wrote:

I have a table with a number of rows. The right most cell contains a
link ‘Delete’ when this is clicked I’d like that row to be removed from
the table.

How can I achieve this?

The approach I’ve tried is wrapping the whole row in a div then when I
the AJAX returns some HTML to update the div it should return nothing.
Is this the best way? Any suggestions?

With your method, there’s going to be a lot of management around each
row having it’s own div and getting refreshed. Instead, I’d recommend
you do the refresh on the entire display of data rows. You may need to
look into using the :collection parm with the render command (syntax is
sometimes a little tricky with how to access the collection members).
It’s quite DRY and easy to maintain.

Assumptions here for purposes of demonstration are that your data has a
“name” field, that you’re using a table layout, and that you are display
:all rows from your data table. You should be able to get the idea here
and adapt to your specific needs.

I’m spewing off the top of my head here, no testing done on this, so I
apologize for any typos or syntax errors.

c.

list action

@data = Object.find(:all)

list.rhtml view

blah
blah
<%= render(:partial => “alldatarows”, :object => @data) %>
blah
blah

_alldatarows.rhtml partial

<%= render(:partial => "onedatarow", :collection => data) %>
Name Action

_onedatarow.rhtml partial

<%= onedatarow.name %> <%= link_to_remote('Delete', :url => {:controller => 'whatever', :action => 'deleterow', :id = 'onedatarow.id'}) %>

deleterow action

blah
delete blah
blah
@data = Object.find(:all)

deleterow.rjs template

page[:alldatarows].replace_html :partial => ‘alldatarows’, :object =>
@data

3

Thanks. I’ll try this method out.

4

Matthew Planchant wrote:

Thanks. I’ll try this method out.

Hey - FYI, typo here, I think “:collection => data” should be
“:collection => alldatarows” in this snippet:

_alldatarows.rhtml partial

<%= render(:partial => "onedatarow", :collection => alldatarows) %>
Name Action
5

Matthew Planchant wrote:

I have a table with a number of rows. The right most cell contains a
link ‘Delete’ when this is clicked I’d like that row to be removed from
the table.

How can I achieve this?

Assign an id to every row and remove it with Protoype’s Element.remove

<% row_id = your_custom_row_id_generating_helper %>

... <%= link_to_function "Delete", "Element.remove(#{row_id})"%>

There’s no need to for AJAX if no updated information is needed from the
server.

–
Sava C.