Problem trying to update multiple <DIV> elements with AJAX

Rails
1

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

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
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.

2

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/rails-rjs-templates

Cheers!

-David F.

3

Hi.

You need RJS!

Check out Cody F.'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”, “

My new html

” 
     # 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 R.schild 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

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
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.

4

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.