Forum: Ruby on Rails problem trying to update multiple <DIV> elements with AJAX

Announcement (2017-05-07): www.ruby-forum.com is now read-only since I unfortunately do not have the time to support and maintain the forum any more. Please see rubyonrails.org/community and ruby-lang.org/en/community for other Rails- und Ruby-related community platforms.
Adam Rothschild (Guest)
on 2006-06-14 04:14
I've been trying for days now to figure this out on my own, but I can't,
so this is my cry for help. Here's my situation: I need to update
multiple <DIV> elements on a page, each with its own HTML, but I just
can't figure out how to get it to work. That is, I want to replace
everything within each <DIV> element with something new. When I try what
I have, nothing changes in the browser. The (what I think are the)
relevant code snippets are as follows:

Calling view:
<%= form_remote_tag(:url => {:action => 'create_problem'},
:complete=>evaluate_remote_response) %>

Controller action:
@choices = get_prob_list_choices
render(:layout=>false)

Returning view:
<% update_element_function("new_prob", :binding=>binding) do %>
    <%=render(:partial=>"new_prob")%>
<%end%>
<% update_element_function("prob_list", :binding=>binding) do %>
    <%=render(:partial=>"prob_list", :locals=>{:choices=>@choices})%>
<%end%>

I've also tried it with the returning view as follows, also to no avail:

<%= update_element_function("new_prob",
:content=>render(:partial=>"new_prob") %>
<%= update_element_function("prob_list",
    :content=>render(:partial=>"prob_list",
:locals=>{:choices=>@choices})) %>

I will be so grateful for help solving this problem.
David Felstead (Guest)
on 2006-06-14 13:51
(Received via mailing list)
Look into RJS templates - the code you are trying to write has already
been written.

Here's a good intro:
http://www.codyfauser.com/articles/2005/11/20/rail...

Cheers!

-David Felstead
286d6ad8e765f90cf2e8c3e5a6a31c4e?d=identicon&s=25 John T. (ottawaronin)
on 2006-06-15 01:42
Hi.

You need RJS!

Check out Cody Fauser's article or his new PDF ebook (just released
yesterday).

But the short of it is:

Your calling html:
<%= link_to_remote "click me", :url => {:controller => 'mycontroller',
      :action => 'update', :id => object.id} %>

your controller:

  def update
      # do something if params[:id] if you need to
      # some other logic...
      # such as @object = Object.find_by_id(params[:id])

      render :update do |page|
         # replace the html inside the element with the <h2>...</h2>
html
         page.replace_html "div_id_1", "<h2>My new html</h2>"

         # replaces html inside element with the partial _newform.rhtml
         page.replace_html "div_id_2", :partial => "newform", :object =>
@object

         # inserts more html into the element at the end
         page.insert_html :bottom, "div_id_3", "add some text at the
end..."

         # does the highlight effect
         page.visual_effect :highlight, "div_id_4", :duration => 2
      end
  end

  or you can put the code inside the render block in a update.rjs file
in the same directory as your other .rhtml files for that controller.

Anyways, check out Cody's book or article.

John.

Adam Rothschild wrote:
> I've been trying for days now to figure this out on my own, but I can't,
> so this is my cry for help. Here's my situation: I need to update
> multiple <DIV> elements on a page, each with its own HTML, but I just
> can't figure out how to get it to work. That is, I want to replace
> everything within each <DIV> element with something new. When I try what
> I have, nothing changes in the browser. The (what I think are the)
> relevant code snippets are as follows:
>
> Calling view:
> <%= form_remote_tag(:url => {:action => 'create_problem'},
> :complete=>evaluate_remote_response) %>
>
> Controller action:
> @choices = get_prob_list_choices
> render(:layout=>false)
>
> Returning view:
> <% update_element_function("new_prob", :binding=>binding) do %>
>     <%=render(:partial=>"new_prob")%>
> <%end%>
> <% update_element_function("prob_list", :binding=>binding) do %>
>     <%=render(:partial=>"prob_list", :locals=>{:choices=>@choices})%>
> <%end%>
>
> I've also tried it with the returning view as follows, also to no avail:
>
> <%= update_element_function("new_prob",
> :content=>render(:partial=>"new_prob") %>
> <%= update_element_function("prob_list",
>     :content=>render(:partial=>"prob_list",
> :locals=>{:choices=>@choices})) %>
>
> I will be so grateful for help solving this problem.
A104931327acb631563a53798f4becff?d=identicon&s=25 Adam R. (aroths1)
on 2006-06-15 05:27
Thanks to both of you for the excellent suggestion. I hooked myself up
with RJS, and it is, indeed, fantastic! So much cleaner and simpler.
Thanks again.
This topic is locked and can not be replied to.