# RJS, & mulitple Drop Down Boxes

**URL:** <https://www.ruby-forum.com/t/rjs-mulitple-drop-down-boxes/60037>\
**Category:** Rails\
**Created:** [May 9, 2006, 5:56pm UTC](https://www.ruby-forum.com/t/rjs-mulitple-drop-down-boxes/60037 "2006-05-09T17:56:44Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![Randal\_S](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/r/b487fb/32.png) [@Randal\_S](https://www.ruby-forum.com/u/Randal_S)\
**Post date:** [May 9, 2006, 5:56pm UTC](https://www.ruby-forum.com/t/rjs-mulitple-drop-down-boxes/60037/1 "2006-05-09T17:56:44Z")

</div>

Hello Again Rails Folk!

I’m trying to creat a page similar to what the person is doing here…

[http://mudabone.com/aietc/?page\_id=410](http://mudabone.com/aietc/?page_id=410)

Instead of doing it the way he/she has, I decided to use RJS files, or  
at least I tried.

Here’s my view

\<%= start\_form\_tag %\>  
\<%= javascript\_include\_tag “prototype” %\>

Union:

 Select Union \<% @unions.each do |union| %\> \<%= union.name %\> \<% end %\> 

Contract:

 Select Contract 

Rate Group

 Select Rate Group 

\<%= observe\_field("new\_contract[union\_id]", :frequency =\> 0.25, :update =\> "contract", :url =\> { :action =\> :add\_contract }, :with =\> "'union\_id='+value") %\>

\<%= observe\_field(“contract”,  
:frequency =\> 0.25,  
:update =\> “rate\_group”,  
:url =\> { :action =\> :add\_rate\_group },  
:with =\> “‘contract\_id=’+value”) %\>  
\<%= end\_form\_tag %\>

and the two RJS files contiain somethign like this… for testing  
purposes…

page.insert\_html :bottom, ‘contracts’, ‘Test’

now, this works for the first change. If I make a change in Union, the  
Contract is updated no problem… however, when I make a change to the  
Contract DropDown, I’ not getting any changes to the third box ( Rate  
Group ).

You would think there would be an OnChange event, rather than using  
Observe\_field. It seems that the second Observe\_field doesn’t “see” the  
contract element to watch it for changes.

I hope somone has a idea of what I’m trtying to do, and maybe some info  
on what I’m doing wrong, or how I could do it better.

I can proabbly get it working the way the person in the linked article  
did it, but I seem so close, I’m wondering what I’m doing wrong.

Cheers and thanks in advance,  
Randal

---

<div class="post-metadata">

**Author:** ![Randal\_S](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/r/b487fb/32.png) [@Randal\_S](https://www.ruby-forum.com/u/Randal_S)\
**Post date:** [May 9, 2006, 7:00pm UTC](https://www.ruby-forum.com/t/rjs-mulitple-drop-down-boxes/60037/2 "2006-05-09T19:00:46Z")

</div>

Randal S. wrote:

> Hello Again Rails Folk!

You can propbably do something like

\<%= select ‘new\_contract’, ‘union\_id’,  
@unioins.collect {|u| [u.name, u.value]},  
:onchange =\> remote\_function(  
:update =\> “contract”,  
:url =\> { :action =\> :add\_contract },  
:with =\> “‘union\_id=’+this.value”  
) %\>

---

<div class="post-metadata">

**Author:** ![Randal\_S](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/r/b487fb/32.png) [@Randal\_S](https://www.ruby-forum.com/u/Randal_S)\
**Post date:** [May 9, 2006, 8:22pm UTC](https://www.ruby-forum.com/t/rjs-mulitple-drop-down-boxes/60037/3 "2006-05-09T20:22:49Z")

</div>

Alex W. wrote:

> Randal S. wrote:
> 
> > Hello Again Rails Folk!
> 
> You can propbably do something like
> 
> \<%= select ‘new\_contract’, ‘union\_id’,  
> @unioins.collect {|u| [u.name, u.value]},  
> :onchange =\> remote\_function(  
> :update =\> “contract”,  
> :url =\> { :action =\> :add\_contract },  
> :with =\> “‘union\_id=’+this.value”  
> ) %\>

I tried this out, and I don’t seem to get anything to work…

It’s probably because I have NO idea what’s going on in he above code.  
Does calling a “remote\_function” call the RJS files?

---

<div class="post-metadata">

**Author:** ![Randal\_S](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/r/b487fb/32.png) [@Randal\_S](https://www.ruby-forum.com/u/Randal_S)\
**Post date:** [May 9, 2006, 10:26pm UTC](https://www.ruby-forum.com/t/rjs-mulitple-drop-down-boxes/60037/4 "2006-05-09T22:26:27Z")

</div>

Ok Tried somethign new…

View:

### Performer Category Rates
 Set Rates for Performer Categories according to Contracts, Unions and Rate Groups. \<%= start\_form\_tag %\> \<%= javascript\_include\_tag "prototype" %\>

Union:

 \<select name="new\_contract[union\_id]" id="new\_contract[union\_id]" onchange="\<%= remote\_function( :url =\> { :action =\> :add\_contract }, :with =\> "'union\_id='+this.value" ) %\>"\> \<option value=""\>Select Union\</option\> \<% @unions.each do |union| %\> \<option value="\<%= union.id %\>"\> \<%= union.name %\> \</option\> \<% end %\> \</select\> \</div\> \</p\> \<p\> Contract: \</p\> \<p\> \<div id="contract\_container"\> \<pre\>\<code\>\</div\> \</code\>\</pre\> \</p\> \<p\> Rate Group: \</p\> \<p\> \<div id="rate\_group\_container"\> \<pre\>\<code\>\</div\> \</code\>\</pre\> \</p\> \<%= end\_form\_tag %\> \<p\>Then I created two Template Files…\</p\> \<p\>\_contracts.rhtml\<br\> \<select name=“contracts” id=“contracts” onchange="\<%= remote\_function(\<br\> :url =\> { :action =\> :add\_rate\_group },\<br\> :with =\> “‘contract\_id=’+this.value”\<br\> ) %\>"\>\<br\> \<option value=""\>Select Contract\</option\>\<br\> \<% \<span class="mention"\>@contracts.each\</span\> do |contract| %\>\<br\> \<option value="\<%= contract.id %\>"\>\<br\> \<%= contract.start\_date %\>\<br\> \</option\>\<br\> \<% end %\>\<br\> \</select\>\</p\> \<p\>and\</p\> \<p\>\_rate\_groups\</p\> \<p\>select name=“rate\_groups” id=“rate\_groups”\>\<br\> \<option value=""\>Select Rate Group\</option\>\<br\> \<% \<span class="mention"\>@rate\_roups.each\</span\> do |rate\_group| %\>\<br\> \<option value="\<%= rate\_group.id %\>"\>\<br\> \<%= rate\_group.name %\>\<br\> \</option\>\<br\> \<% end %\>\<br\> \</select\>\</p\> \<p\>and then two RJS files\</p\> \<p\>add\_contract.rjs\<br\> page.replace\_html ‘contract\_container’, :partial =\> ‘contracts’\</p\> \<p\>add\_rate\_group\<br\> page.replace\_html ‘rate\_group\_container’, :partial =\> ‘rate\_groups’\</p\> \<p\>The contract file updates fine when I select a union however the\<br\> rate\_group template never shows up… I’ve been fighting with this for\<br\> like two das, I’m pretty sure I’m just missing something small…\</p\> \<p\>I hate being a n00b…\</p\> \<p\>Any help would be much obliged.\</p\>

---

<div class="post-metadata">

**Author:** ![Randal\_S](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/r/b487fb/32.png) [@Randal\_S](https://www.ruby-forum.com/u/Randal_S)\
**Post date:** [May 9, 2006, 11:13pm UTC](https://www.ruby-forum.com/t/rjs-mulitple-drop-down-boxes/60037/5 "2006-05-09T23:13:11Z")

</div>

Ok well, for anyone else who is trying this, the above way works…

Just make sure you do two things which help you out…

#1 - Watch teh WebRick server for errors, since they don’t appear…

#2 - don’t forget G’s in the names of variables… 🙂

\<% @rate\_roups.each do |rate\_group| %\>

It works otherwise…

---

<div class="post-metadata">

**Author:** ![Randal\_S](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/r/b487fb/32.png) [@Randal\_S](https://www.ruby-forum.com/u/Randal_S)\
**Post date:** [May 10, 2006, 3:07am UTC](https://www.ruby-forum.com/t/rjs-mulitple-drop-down-boxes/60037/6 "2006-05-10T03:07:52Z")

</div>

Randal S. wrote:

> now, this works for the first change. If I make a change in Union, the  
> Contract is updated no problem… however, when I make a change to the  
> Contract DropDown, I’ not getting any changes to the third box ( Rate  
> Group ).
> 
> You would think there would be an OnChange event, rather than using  
> Observe\_field. It seems that the second Observe\_field doesn’t “see” the  
> contract element to watch it for changes.
> 
> I hope somone has a idea of what I’m trtying to do, and maybe some info  
> on what I’m doing wrong, or how I could do it better.
> 
> I can proabbly get it working the way the person in the linked article  
> did it, but I seem so close, I’m wondering what I’m doing wrong.
> 
> Cheers and thanks in advance,  
> Randal

Just take out :frequency option from oberserve\_field, then it will  
trigger onchange without a fixed interval. :frequency is useful when you  
want to monitor the input of a text field.

Good luck~

---

<div class="post-metadata">

**Author:** ![Randal\_S](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/r/b487fb/32.png) [@Randal\_S](https://www.ruby-forum.com/u/Randal_S)\
**Post date:** [May 25, 2006, 7:35pm UTC](https://www.ruby-forum.com/t/rjs-mulitple-drop-down-boxes/60037/7 "2006-05-25T19:35:11Z")

</div>

Hello,

Try to put a :complete =\> “eval(request.responseText)” in your  
remote\_function declaration. Probabily, the code page.replace\_html  
‘contract\_container’, :partial =\> ‘contracts’ is being converted in  
javascript and this javascript is being received as text/html as  
response. You have to evaluate javascript in order to work. you can try  
another approach: create a method in your application\_controller like  
this:

class ApplicationController \< ActionController::Base

before\_filter :init

def init  
if request.xhr?  
@headers[“Content-Type”] = “text/javascript; charset=utf-8”  
else  
@headers[“Content-Type”] = “text/html; charset=utf-8”  
end  
end  
…  
end

This way, you don’t have to use eval(…).

[]'s  
Marcia

piggybox wrote:

> Randal S. wrote:
> 
> > now, this works for the first change. If I make a change in Union, the  
> > Contract is updated no problem… however, when I make a change to the  
> > Contract DropDown, I’ not getting any changes to the third box ( Rate  
> > Group ).
> > 
> > You would think there would be an OnChange event, rather than using  
> > Observe\_field. It seems that the second Observe\_field doesn’t “see” the  
> > contract element to watch it for changes.
> > 
> > I hope somone has a idea of what I’m trtying to do, and maybe some info  
> > on what I’m doing wrong, or how I could do it better.
> > 
> > I can proabbly get it working the way the person in the linked article  
> > did it, but I seem so close, I’m wondering what I’m doing wrong.
> > 
> > Cheers and thanks in advance,  
> > Randal
> 
> Just take out :frequency option from oberserve\_field, then it will  
> trigger onchange without a fixed interval. :frequency is useful when you  
> want to monitor the input of a text field.
> 
> Good luck~