Forum: Ruby on Rails Dynamic Select Box

Announcement (2017-05-07): www.ruby-forum.com is now read-only since I unfortunately do not have the time to support and maintain the forum any more. Please see rubyonrails.org/community and ruby-lang.org/en/community for other Rails- und Ruby-related community platforms.
Karl W. (Guest)
on 2006-04-12 14:35
Hi,

I'm new to rails/ruby having come from PHP and am just starting to get
my head round how easy it can be :)

However, can anyone point me in the right direction for dynamicaly
updating a select box based upon the choice of a previous select box,
without a page refresh.

Any and all help greatly appreciated.

Thanks
Daniel -. (Guest)
on 2006-04-12 15:23
(Received via mailing list)
Using RJS calls with an observe_field is the way to go.  Works great in
FF
but you cannot do this in IE by using RJS alone.  The reason is that RJS
uses the innerHTML method to replace content with a page.html_replace
call.
IE does not support the innerHTML call on select boxes.  You would need
to
implement it in javascript completely.

The only way that I can think of (maybe) is to use a javascript array
and
update the array from an RJS call.

Cheers
Alex Y. (Guest)
on 2006-04-12 16:56
(Received via mailing list)
Liquid wrote:
> Using RJS calls with an observe_field is the way to go.  Works great in
> FF but you cannot do this in IE by using RJS alone.  The reason is that
> RJS uses the innerHTML method to replace content with a
> page.html_replace call.  IE does not support the innerHTML call on
> select boxes.  You would need to implement it in javascript completely.
Or rip out the whole select box and replace it, rather than just the
option list.

--
Alex
Brian H. (Guest)
on 2006-04-12 20:16
(Received via mailing list)
My approach was exactly that....

My select box was monitored by an observer.. The observer called another
action that rendered the partial for the second select box.
Daniel -. (Guest)
on 2006-04-13 04:02
(Received via mailing list)
I did try to rip out the entire select box and replace it, but for some
reason that I still havn't worked out, once I replaced the select box,
the
observe_field didn't work anymore so my next box (I had 3) was never
going
to update.
Ezra Z. (Guest)
on 2006-04-13 04:48
(Received via mailing list)
On Apr 12, 2006, at 5:02 PM, Liquid wrote:

> I did try to rip out the entire select box and replace it, but for
> some reason that I still havn't worked out, once I replaced the
> select box, the observe_field didn't work anymore so my next box (I
> had 3) was never going to update.
>

Here is one way that we have been doing dynamic select boxes. Maybe
this helps you a bit.


----The first select box --------
       <span class='formw' style='width: 70%;'>
         <%= select_tag( :model_year,
                         options_for_select( @model_years, session
[:PersVeh].model_year ),
                         :onchange => remote_function( :update =>
'NOTUSED',
                                                       :with =>
"'model_year='+value",
                                                       :loading =>
"Element.show('loading-indicator1')",
                                                       :complete =>
evaluate_remote_response,
                                                       :url =>
{ :action => :vehicle_select_make } ) ) %>
         <%= image_tag('indicator.gif',
                       :id    => 'loading-indicator1',
                       :style => 'display:none;' ) -%>
       </span>



----submits to an action that fills the variables and then does
render :layout => false----

----Here is what the action renders------

<%= update_element_function('vehicle_makes',
                             :content => render( :partial =>
'vehicle_select_make' ) ) %>
Element.hide('loading-indicator1');
Element.show('vehicle_makes');
<%= update_element_function('button-group',
                             :content => render( :partial =>
'vehicle_buttons' ) ) %>




So basically the trick is with the  :complete =>
evaluate_remote_response in the select tags. This makes the results
of the request get eval'ed in JS.

Hope that helps a bit.

Cheers-
-Ezra
Daniel -. (Guest)
on 2006-04-13 04:54
(Received via mailing list)
Thanx Ezra...

Is there some documentation for evaluate_remote_response?  Is this a
ruby/rails method or a JS function?  I'm not familiar with this one.

Cheers
Ezra Z. (Guest)
on 2006-04-13 05:21
(Received via mailing list)
I'm not sure if there is any docs for that ;) I found it a long time
ago by accident and I don't remember seeing much docu for it.

	Ohh wait here it is!

http://rubyonrails.com/rails/classes/ActionView/Helpers/
PrototypeHelper.html#M000419


Cheers-
-Ezra
Daniel -. (Guest)
on 2006-04-13 05:24
(Received via mailing list)
Cool ...  Thanx I'll give it a try..
andre hartawan (Guest)
on 2006-04-13 06:07
(Received via mailing list)
can i use ruby to develope mobile application

andre

__________________________________________________
Do You Yahoo!?
Tired of spam?  Yahoo! Mail has the best spam protection around
http://mail.yahoo.com
David M. (Guest)
on 2006-04-13 06:28
(Received via mailing list)
Yes

Dave M.
Karl W. (Guest)
on 2006-04-13 12:48
Thanks Ezra. That's just what i needed

Karl
Ramanan (Guest)
on 2006-08-19 02:00
Daniel ----- wrote:
> Cool ...  Thanx I'll give it a try..

Were  you able to imlement the dynamic select box?  I have a similar
requirement to populate City based on State and then Locality based on
City.

If yes, could you please email me the code or paste the code here.

Thx.
Ramanan
Kevin O. (Guest)
on 2006-08-19 02:45
(Received via mailing list)
On Saturday, August 19, 2006, at 12:00 AM, Ramanan wrote:
>Ramanan
>
>
>--
>Posted via http://www.ruby-forum.com/.
>_______________________________________________
>Rails mailing list
>removed_email_address@domain.invalid
>http://lists.rubyonrails.org/mailman/listinfo/rails

Take a look at this...

http://www.sciwerks.com/blog/2006/07/07/updating-s...

_Kevin
www.sciwerks.com
Ramanan (Guest)
on 2006-08-19 03:01
Kevin O. wrote:
> On Saturday, August 19, 2006, at 12:00 AM, Ramanan wrote:
>>Ramanan
>>
>>
>>--
>>Posted via http://www.ruby-forum.com/.
>>_______________________________________________
>>Rails mailing list
>>removed_email_address@domain.invalid
>>http://lists.rubyonrails.org/mailman/listinfo/rails
>
> Take a look at this...
>
> http://www.sciwerks.com/blog/2006/07/07/updating-s...
>
> _Kevin
> www.sciwerks.com


I have a working code where there are only 2 select boxes i.e.
populating city when state is selected.  I am having issues with
populating locality based on selected city.  Working with 2 dynamic
select is straight forward.  Working with more than 2 dynamic/cascading
select box is a real issue.

Thx. for your help
Iw (Guest)
on 2006-09-01 17:30
I am experiencing problems retrieving information from the related drop
downs.
I can save information in the database (i.e. state_id and city_id  are
getting saved in the Address table).

 However on the  Address's edit/update screen, the information from the
first "State" drop down is getting retrieved
properly but nothing is getting displayed in the second drop down -
"City".

I am using observe fields to retrieve data for the second drop down.
Please advise how to prepopulate information for the second drop down
 based on the "id" stored in the database on Edits screens.

Thanks in advance for your help!

I


Ramanan wrote:
> Kevin O. wrote:
>> On Saturday, August 19, 2006, at 12:00 AM, Ramanan wrote:
>>>Ramanan
>>>
>>>
>>>--
>>>Posted via http://www.ruby-forum.com/.
>>>_______________________________________________
>>>Rails mailing list
>>>removed_email_address@domain.invalid
>>>http://lists.rubyonrails.org/mailman/listinfo/rails
>>
>> Take a look at this...
>>
>> http://www.sciwerks.com/blog/2006/07/07/updating-s...
>>
>> _Kevin
>> www.sciwerks.com
>
>
> I have a working code where there are only 2 select boxes i.e.
> populating city when state is selected.  I am having issues with
> populating locality based on selected city.  Working with 2 dynamic
> select is straight forward.  Working with more than 2 dynamic/cascading
> select box is a real issue.
>
> Thx. for your help
_Kevin (Guest)
on 2006-09-01 18:20
(Received via mailing list)
Iw wrote:
> I am using observe fields to retrieve data for the second drop down.
> >> On Saturday, August 19, 2006, at 12:00 AM, Ramanan wrote:
> >> Take a look at this...
> > select is straight forward.  Working with more than 2 dynamic/cascading
> > select box is a real issue.
> >
> > Thx. for your help
>
>
> --
> Posted via http://www.ruby-forum.com/.

You'd have to give us a bit more information about how you are
populating your select in the first place.

_Kevin
Iw (Guest)
on 2006-09-01 18:58
Here is relevant code:
The "city" in the second dropdown is not getting selected in Edit
screen.

Thank you so much for you help!
------------------------------
_form.rhtml


	<%= collection_select(:address, "state_id", State.find(:all), :id,
:state) %>
	<p id="address_city_container"><%= render :partial => 'select_city'
%></p>

	        <%= observe_field("address_state_id",
	                :frequency => 0.25,
	                :update => "address_city_container",
	                :url => {:controller => 'address', :action =>
:filtered_city_select},
	                :with => "'state_id=' + value")%>
<% --------
	- address_controller.rb

 def filtered_city_select

   @cities = City.find_all_by_state_id(@params["state_id"])
    render :partial => 'select_cities'
 end



 def edit
   @address = Address.find(params[:id])
   @states = State.find_all
   @cities = City.find(:all, :conditions =>[ "state_id = ?",
@address.state_id])

 end


 %>

------
partial _select_cities.rhtml

<% if @cities %>
<select name="address[city_id]" id="address_city_id">
     <option value="">-- Select City --</option>
 	<%=
		 options_from_collection_for_select(@cities, "id", "city")
	%>
 </select>
<% end %>
_Kevin (Guest)
on 2006-09-01 19:30
(Received via mailing list)
Iw wrote:
> :state) %>
> 	- address_controller.rb
>    @address = Address.find(params[:id])
> partial _select_cities.rhtml
> --
> Posted via http://www.ruby-forum.com/.

Couple of points.
1. if you set the frequency of your observer to 0, it should fire off
whenever the value changes, and not every 0.25 seconds.

2. check your log files to see if you are getting errors thrown by the
filtered_city_select method

3. Don't use '@params', it's deprecated.

Does it work at all?

_Kevin
Iw (Guest)
on 2006-09-01 20:03
_Kevin wrote:
> Iw wrote:
>> :state) %>
>> 	- address_controller.rb
>>    @address = Address.find(params[:id])
>> partial _select_cities.rhtml
>> --
>> Posted via http://www.ruby-forum.com/.
>
> Couple of points.
> 1. if you set the frequency of your observer to 0, it should fire off
> whenever the value changes, and not every 0.25 seconds.
>
> 2. check your log files to see if you are getting errors thrown by the
> filtered_city_select method
>
> 3. Don't use '@params', it's deprecated.
>
> Does it work at all?
>
> _Kevin



No errors in the log.
Insert works. Data is getting saved in the database. The Edit/Update
screen does not highlight (select) the item in the second drop down -
the city.
Dan Miller (Guest)
on 2006-10-11 19:14
You can do it with mostly javascript.

Here is an Ajax 'double select' widget, in object-oriented,
cross-browser JavaScript. Very easy to plug and play:

http://www.webonweboff.com/widgets/ajax/ajax_linke...

Article includes a demo, source code, explanations. The page that
actually retrieves the db data will need to be in your web language of
choice, of course.

Hope this helps...
Cayce B. (Guest)
on 2006-10-11 20:06
Another option is to observe and redraw the entire form, rather than
just field-by-field.

I have my entire form in a partial, and I use RJS to redraw the partial
from an observe_form event - anytime anything changes in the form, the
entire form is redrawn and this accomplishes 2x, 3x, Nx select box
updates.

c.


Ramanan wrote:
>
> I have a working code where there are only 2 select boxes i.e.
> populating city when state is selected.  I am having issues with
> populating locality based on selected city.  Working with 2 dynamic
> select is straight forward.  Working with more than 2 dynamic/cascading
> select box is a real issue.
>
> Thx. for your help
Daniel -. (Guest)
on 2006-11-07 12:00
(Received via mailing list)
On 8/19/06, Ramanan <removed_email_address@domain.invalid> wrote:
> Thx.
> Ramanan
>
>
> --
> Posted via http://www.ruby-forum.com/.
> _______________________________________________
> Rails mailing list
> removed_email_address@domain.invalid
> http://lists.rubyonrails.org/mailman/listinfo/rails
>

I did end up with something...  You can find it at
http://rails.techno-weenie.net/tip/2006/6/20/casca...

But this is far from perfect.  Kevins has given an alternative solution
as
well, but the one that I'm after I can't seem to find.

Shortly after I posted the tip on
http://rails.techno-weenie.netTechnoweenie, aka Rick O. posted a
much better solution.  Since then
there has been some db issues at rails weenie and I can't find it.

Rick if you catch this post can you please provide a link to the tip you
posted.

Cheers
This topic is locked and can not be replied to.