RJS, & mulitple Drop Down Boxes

Rails
1

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

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

2

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”
) %>

3

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?

4

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

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… :slight_smile:

<% @rate_roups.each do |rate_group| %>

It works otherwise…

6

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~

7

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~