Beginner's question on updating a div on submit

Hello, thanks for reading my question first:
Say I have in my database a table that contains recipes and a table
that contains comment on recipes so I am thinking giving each comment
an ID of recipe that it’s commenting on. But I want to do something
fancier: I want to have a list of comments on the recipe page, and a
popup form for viewer to comment on a recipe on the same page, and then
(my question here:) when a user finish writing up their comment, and
hits submit, the comment goes to the comment table in the database and
without refreshing, my div that contains the list of comment on the
recipe page refreshes to show the newly added comment. Is this easy to

Thanks for answering my question!


Sure, that’s what ajax is for.
Use form_remote_tag instead of form_tag.
There are 2 ways you can do this:

form_remote_tag :url => {:action => ‘my_action’}, :update => ‘comments’,
:position => :bottom
And then render a partial that creates your div. This assumes you have a
div/table/etc… with id ‘comments’ that contains all of your comments.
You can of course use :position =>:top if you want the new comment at
the top.

The limitation of this is that it only allows you to update one thing,
whereas you might want to add the comment, change some text that shows
number of comments, last time a comment with made etc…
For this you would use rjs.

form_remote_tag :url => {:action => ‘my_action’}

Then instead of having an rhtml template you have a rjs template, which
might look a little like this.

page.insert_html :bottom, :comments, :partial => ‘comment’, :object =>
page.replace_html ‘header’, :partial => ‘header’

This would insert the comment at the bottom, and update a div called
‘headed’ by render the _header partial. There’s a lot more you can do
with rjs.