Deleting

I have been try to make a page where a user can add something to a list and then delete something from the same list all without re-loading the page. The adding part is easy, but the deleting part is turning out to be a pain.

A user by the name of Philip gave me some very helpful hints: Put the snip of rHTML that needs to refresh into a partial. Include it the normal way, like this:

<div id='refresh_me'>
    <%= render :partial => 'my_partial' %>
</div>

Now wire link_to_remote up to an action that looks like this:

def my_action
    return unless request.xhr?
    render :update do |page| # <-- I call that rjs sometimes!
       page.replace_html 'refresh_me', :partial => 'my_partial'
    end
end

The deal is that almost* anything you can pass to render, you can also pass to the second argument to JavaScriptGenerator#replace_html.

The first code injects raw HTML into your page as it renders, before it goes over the wire. The second snip renders the partial, then creates JavaScript containing Element.update('refresh_me', '<my partial html >'). This goes over the wire, and the Ajax handlers from prototype.js will replace the innerHTML member of that <div id='refresh_me'> with the new version.

(Question for the lifers - is it _really_ "almost anything"? Or is it
"anything"!?)

I haven't come across anything that I couldn't send back yet...

This does not work, however, it just reloads the entire page within the
list. Does anyone have any other ideas or sugestions. I realize that I
am probably implementing the above code wrong, but I have tried every
way that I can think of. Thanks,

What does your link_to_remote look like? It should just update the 'refresh_me' div with the result of the partial 'my_partial'.

Also, if you want to delete an item, another idea would be to assign each item it's own id. Say

<div id='my_item_123'>This is item 123</div>
...

Then in your delete action (or link to method for that action in a callback on success) use an event to simply remove that element from the page. Then nothing has to update, and the item simply goes away after deleting it.

-philip

It looks like this. 'hotel_info-refresh' is the name of the div and
'delete_hotel_info' is the name of the method that does the destroy. I
will try giving each item an id.
<%= link_to_remote 'Delete', :update => 'hotel_info_refresh', :action =>
'delete_hotel_info', :id => @user.id %>

Did you just mis-type the dash vs underscore in your div id and the value of :update? Otherwise it looks okay to me.

Oh Wait!

If you're passing in :update, you don't need to do a page.replace_html in your action. Just render the partial with :layout => false.