thr3ads.net - Rails - Help with RJS to loop through divs and change hyperlinks [Oct 2007]

If this information is useful, please help other people find it:
Share via:

chirag

2007-Oct-31 07:32 UTC

Help with RJS to loop through divs and change hyperlinks

I have some rhtml (see below) which includes 5 divs placed under a div
with classname "container". Can somone help me write some RJS to

	a. Find the "container" div
	b. Loop through the 5 child divs and:
		i. Change the innerHTML (text of the hyperlink) of each child div
which is a hyperlink using link_to_remote  (I assume something similar
to page.replace_html)
		ii. Change the "url" of each child div to point to another url

Some sample code would be appreciated. I''m not sure where to start
really.

Thanks!
Chirag

                <div class="container">
                    <div class="selsec">
                        <%=link_to_remote("Live!",
                        :update => ''chart'',
                        :url => url_for(:controller =>
''chart'', :action => ''live''),
                        :loading =>
"Element.show(''loading''); ",
                        :complete =>
"Element.hide(''loading'')",
                        :before => "toggleVTabs(this.parentNode);")
%>
                    </div>
                    <div class="sec">
                        <%=link_to_remote("Last half hour",
                        :update => ''chart'',
                        :url => url_for(:controller =>
''chart'', :action => ''last_half_hour''),
                        :loading =>
"Element.show(''loading''); ",
                        :complete =>
"Element.hide(''loading'')",
                        :before => "toggleVTabs(this.parentNode);")
%>
                    </
div>
                    <div class="sec">
                        <%=link_to_remote("Last hour",
                        :update => ''chart'',
                        :url => url_for(:controller =>
''chart'', :action => ''last_hour''),
                        :loading =>
"Element.show(''loading''); ",
                        :complete =>
"Element.hide(''loading'')",
                        :before => "toggleVTabs(this.parentNode);")
%>
                    </div>
                    <div class="sec">
                        <%=link_to_remote("Last 6 hours",
                        :update => ''chart'',
                        :url => url_for(:controller =>
''chart'', :action => ''last_six_hours''),
                        :loading =>
"Element.show(''loading''); ",
                        :complete =>
"Element.hide(''loading'')",
                        :before => "toggleVTabs(this.parentNode);")
%>
                    </div>
                    <div class="sec">
                        <%=link_to_remote("All day",
                        :update => ''chart'',
                        :url => url_for(:controller =>
''chart'', :action => ''all_day''),
                        :loading =>
"Element.show(''loading''); ",
                        :complete =>
"Element.hide(''loading'')",
                        :before => "toggleVTabs(this.parentNode);")
%>
                    </div>
                </div>


--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en
-~----------~----~----~----~------~----~------~--~---

chirag

2007-Oct-31 18:05 UTC

head link

Re: Help with RJS to loop through divs and change hyperlinks

THIS IS WRITTEN MUCH BETTER

I have some rhtml code which includes 5 divs placed under a
"container" div.

I would like to use RJS to do the following, but I''m not sure where to
start really.

1.	Find the "container" div
2.	Loop through the 5 child divs and:
         a.	Change the innerHTML of each child div.  Since each child
div is a hyperlink using  link_to_remote , this is a little tricky. (I
assume something similar to page.replace_html would be used)
         b.	Change the ":url" parameter of each child div to point to
another url

Is this possible with RJS? If so, can you recommend some
JavaScriptGenerator methods or other helper/methods that could be
used? It may be easier to use straight up Javascript. If so, could you
point  me to some methods that would help?

The code is here: http://pastie.caboo.se/112768


--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en
-~----------~----~----~----~------~----~------~--~---

William Pratt

2007-Nov-01 04:07 UTC

head link

Re: Help with RJS to loop through divs and change hyperlinks

I do similar things. If you are including the Prototype library in your 
rails app, you can just give all of the divs a common css class name and 
select all of them that way using a proxy collection:

<div id="foo1" class="divs_to_change"/>
<div id="foo2" class="divs_to_change"/>
....

then in rjs:

page.select(''.divs_to_change'').each do |div|
    div.replace_html :partial => ''foo'' #or whatever you
want to do with
each div.
end

Does that help?

-Bill

chirag wrote:> THIS IS WRITTEN MUCH BETTER
>
> I have some rhtml code which includes 5 divs placed under a
> "container" div.
>
> I would like to use RJS to do the following, but I''m not sure
where to
> start really.
>
> 1.	Find the "container" div
> 2.	Loop through the 5 child divs and:
>          a.	Change the innerHTML of each child div.  Since each child
> div is a hyperlink using  link_to_remote , this is a little tricky. (I
> assume something similar to page.replace_html would be used)
>          b.	Change the ":url" parameter of each child div to
point to
> another url
>
> Is this possible with RJS? If so, can you recommend some
> JavaScriptGenerator methods or other helper/methods that could be
> used? It may be easier to use straight up Javascript. If so, could you
> point  me to some methods that would help?
>
> The code is here: http://pastie.caboo.se/112768
>
>
> >
>   
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en
-~----------~----~----~----~------~----~------~--~---

William Pratt

2007-Nov-01 04:08 UTC

head link

Re: Help with RJS to loop through divs and change hyperlinks

Btw, the O''reilly book Ajax on Rails is a really good guide to this 
stuff with a nice Prototype / Scritaculous reference in it.

-Bill

chirag wrote:> THIS IS WRITTEN MUCH BETTER
>
> I have some rhtml code which includes 5 divs placed under a
> "container" div.
>
> I would like to use RJS to do the following, but I''m not sure
where to
> start really.
>
> 1.	Find the "container" div
> 2.	Loop through the 5 child divs and:
>          a.	Change the innerHTML of each child div.  Since each child
> div is a hyperlink using  link_to_remote , this is a little tricky. (I
> assume something similar to page.replace_html would be used)
>          b.	Change the ":url" parameter of each child div to
point to
> another url
>
> Is this possible with RJS? If so, can you recommend some
> JavaScriptGenerator methods or other helper/methods that could be
> used? It may be easier to use straight up Javascript. If so, could you
> point  me to some methods that would help?
>
> The code is here: http://pastie.caboo.se/112768
>
>
> >
>   
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en
-~----------~----~----~----~------~----~------~--~---

William Pratt

2007-Nov-01 04:19 UTC

head link

Re: Help with RJS to loop through divs and change hyperlinks

One more thing, these proxies will work with any css selectors, so if 
your outer div has an id of outer_div, this will do the same thing:

page.select(''#outer_div div'').each do |div|
    div.replace_html :partial => ''foo'' #or whatever you
want to do with each div.
end

-Bill

William Pratt wrote:> I do similar things. If you are including the Prototype library in your 
> rails app, you can just give all of the divs a common css class name and 
> select all of them that way using a proxy collection:
>
> <div id="foo1" class="divs_to_change"/>
> <div id="foo2" class="divs_to_change"/>
> ....
>
> then in rjs:
>
> page.select(''.divs_to_change'').each do |div|
>     div.replace_html :partial => ''foo'' #or whatever
you want to do with
> each div.
> end
>
> Does that help?
>
> -Bill
>
> chirag wrote:
>   
>> THIS IS WRITTEN MUCH BETTER
>>
>> I have some rhtml code which includes 5 divs placed under a
>> "container" div.
>>
>> I would like to use RJS to do the following, but I''m not sure
where to
>> start really.
>>
>> 1.	Find the "container" div
>> 2.	Loop through the 5 child divs and:
>>          a.	Change the innerHTML of each child div.  Since each child
>> div is a hyperlink using  link_to_remote , this is a little tricky. (I
>> assume something similar to page.replace_html would be used)
>>          b.	Change the ":url" parameter of each child div to
point to
>> another url
>>
>> Is this possible with RJS? If so, can you recommend some
>> JavaScriptGenerator methods or other helper/methods that could be
>> used? It may be easier to use straight up Javascript. If so, could you
>> point  me to some methods that would help?
>>
>> The code is here: http://pastie.caboo.se/112768
>>
>>
>>     
>>   
>>     
>
> >
>   
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en
-~----------~----~----~----~------~----~------~--~---

chirag

2007-Nov-01 19:21 UTC

head link

Re: Help with RJS to loop through divs and change hyperlinks

Thanks Bill! That helped a lot.

Also, could I set up a loop to parse a YAML file (see example below)
and set up a div for each line in the YAML file?

So, essentially, what would the RJS for the following steps look like:
1.	Find the container div
2.	Loop through a YAML file and add child divs containing the partial
specified in each line in the YAML file

YAML file
tabs:
  partial:   live
  partial:   last_half_hour
  partial:   last_six_hours
  partial:   all_day

Chirag


--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en
-~----------~----~----~----~------~----~------~--~---

William Pratt

2007-Nov-01 22:18 UTC

head link

Re: Help with RJS to loop through divs and change hyperlinks

You can mix plain ruby code into the rjs block, so that should make it 
fairly easy to what you want.

-Bill

chirag wrote:> Thanks Bill! That helped a lot.
>
> Also, could I set up a loop to parse a YAML file (see example below)
> and set up a div for each line in the YAML file?
>
> So, essentially, what would the RJS for the following steps look like:
> 1.	Find the container div
> 2.	Loop through a YAML file and add child divs containing the partial
> specified in each line in the YAML file
>
> YAML file
> tabs:
>   partial:   live
>   partial:   last_half_hour
>   partial:   last_six_hours
>   partial:   all_day
>
> Chirag
>
>
> >
>   
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en
-~----------~----~----~----~------~----~------~--~---

Rails - Oct 2007 - Help with RJS to loop through divs and change hyperlinks

Help with RJS to loop through divs and change hyperlinks

Re: Help with RJS to loop through divs and change hyperlinks

Re: Help with RJS to loop through divs and change hyperlinks

Re: Help with RJS to loop through divs and change hyperlinks

Re: Help with RJS to loop through divs and change hyperlinks

Re: Help with RJS to loop through divs and change hyperlinks

Re: Help with RJS to loop through divs and change hyperlinks