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:
<%= render :partial => 'my_partial' %>
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’, ‘’). This
goes over the wire, and the Ajax handlers from prototype.js will replace
the
innerHTML member of that
with the new version.
(Question for the lifers - is it really “almost anything”? Or is it
“anything”!?)
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,
(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
This is item 123
...
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.
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.
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 %>