Hi!
The problem to update multiple DOMs has struggled me for a while, and
others too I realized when browsing the web for find a solutions for my
problems. Ok, since it easy that one seldom gives something back when a
solution is found I’ll post this example here. If you want to give
response, please dont forget:
- Was this useful for you?
- Is this the rails way to do it?
- Are there better solutions?
- What ever you want to say about it!
I’m no way an experienced ‘railer’, but intrested in it!
Problem:
When something happends e.g a dropdown box changes one might want to
make a AJAX call and update some (that is, multiple) DOM elements.
Solution: Use update_element_function (people complain about the
documentation of this function (and others) including my self.)
Example:
This is a really easy example and it is complete!
search_test_controller.rb:
class SearchTestController < ApplicationController
layout “default-layout”
include ActionView::Helpers::JavaScriptHelper
include ActionView::Helpers::TagHelper
def initialize
@s_start ="DOM3"
end
def index
end
def update
text = ""
text += javascript_tag(update_element_function("dom-1",
:content => "<p style='color: red;'>Updating this
sucker!
",:position => :bottom))
text += javascript_tag(update_element_function("dom-2",
:content => "<p style='color: red;'>Updating this sucker,
too!
",:position => :bottom))
text += link_to_remote("Clean up", :update => "dom-3", :url =>
{:action => “clean_up”})
render_text "This is the part that should update dom-1 and dom-2 <br
/>"+text
end
def clean_up
render_text @s_start
end
end
index.rhtml:
TestMulti DOM Update Test
Below are som data we want to update. There are two DOMs (div-tags), dom-1 and dom-2 defined here. We want to update both with one click!
<%= link_to_remote “Update DOM-1 and DOM-2”, :update => “dom-3”, :url =>
{:action => “update”} %>
Hope this helps! In this way it is possible to update dynamically named
DOM-IDs, since the update_element_function is generated in the
controller (in this simple example it is static though)