Select another value in a combo box with a button click

Rails
1

Hi, I was wondering if anyone can help me with this as I just don’t seem
to figure out how I can refer to a combo box and change its selected
value to another with a button click.
Suppose a cambo box has values ‘1’, ‘2’, and ‘3’ and I have a button
“Next” and that currently ‘1’ is selected in the combo box. So, when I
click “Next” button I want it to select ‘2’ and so on…

Thanks.

2

Hi Jay,

Jay P. wrote:

Hi, I was wondering if anyone can help me with this as I just don’t seem
to figure out how I can refer to a combo box and change its selected
value to another with a button click.
Suppose a cambo box has values ‘1’, ‘2’, and ‘3’ and I have a button
“Next” and that currently ‘1’ is selected in the combo box. So, when I
click “Next” button I want it to select ‘2’ and so on…

If I understand your question, one way I’ve done it is to put the combo
box
in a partial with the selected value ‘fed’ and then use Ajax / RJS to
re-render the partial as part of the “Next” action.

HTH,
Bill

3

Jay P. wrote:

Hi, I was wondering if anyone can help me with this as I just don’t seem
to figure out how I can refer to a combo box and change its selected
value to another with a button click.
Suppose a cambo box has values ‘1’, ‘2’, and ‘3’ and I have a button
“Next” and that currently ‘1’ is selected in the combo box. So, when I
click “Next” button I want it to select ‘2’ and so on…

Thanks.

Posted via http://www.ruby-forum.com/.

We can achieve the same effect purely on the client-side.

Assuming your select dropdown is named “dropdown”:

<input type=“button” value=“Next” onclick="if($(‘dropdown’).length - 1

$(‘dropdown’).selectedIndex) $(‘dropdown’).selectedIndex++;" />

This requires Prototype, btw.

4

On Oct 10, 12:16 pm, Jay P. [email protected]
wrote:

Posted viahttp://www.ruby-forum.com/.
I still think that a client-side JS is better here, since IMHO an AJAX
call just to select the next item of an already populated select
dropdown is simply too much.

<%= submit_tag “Next”,
:onclick => “if($(‘camp’).length - 1 > $(‘camp’).selectedIndex) $
(‘camp’).selectedIndex++; return false;” %>

5

Hi, guys thanks for all the help. Here’s how I have created the combo
box:

<%=select :camp, :id, @campsites_list%>

So, how would I reference it and its a partial and its under
_campsites.rhtml (partial file).
Thanks.

6

On Oct 10, 1:54 pm, Jay P. [email protected]
wrote:

Campgrounds
<%=select "camp", "id", @resultset %>

Where is the partial rendered? And when should it be rendered? I don’t
see it in your main view.

7

Erol F. wrote:

On Oct 10, 1:54�pm, Jay P. [email protected]
wrote:

� Campgrounds
� <%=select "camp", "id", @resultset %>

Where is the partial rendered? And when should it be rendered? I don’t
see it in your main view.

The file below is the partial which gets rendered in the

whose id
is “campsites_list” in the view inside the <%form_for%> … <%end%>.
observe_field is observing the combo box with id :great_walks which is
the first combo box in the view and updates the combo box inside the
<%form_for%>…<%end%> inside
and this
is getting updated
with the following partial file:

_campsites.rhtml

Campgrounds
<%=select "camp", "id", @resultset %>

--------------------------------------------------------------------------------

thanks…

8

On Oct 10, 1:54 pm, Jay P. [email protected]
wrote:

Thanks Erol F. for the answer… but I just couldn’t make any use
of it coz it doen’t work and I’m using <%=javascript_include_tag
“prototype.js”%>. To make clear what I’m doing here is my code:

Try this instead:

<%= submit_tag “Next”, :onclick => “if($(‘camp_id’).length - 1 > $
(‘camp_id’).selectedIndex) $(‘camp_id’).selectedIndex++; return
false;” %>

9

Erol F. wrote:

<%= submit_tag “Next”,
:onclick => “if($(‘camp’).length - 1 > $(‘camp’).selectedIndex) $
(‘camp’).selectedIndex++; return false;” %>

Thanks Erol F. for the answer… but I just couldn’t make any use
of it coz it doen’t work and I’m using <%=javascript_include_tag
“prototype.js”%>. To make clear what I’m doing here is my code:

VIEW:

Locations
<%= select(:walks, :id, Greatwalk.find_available_locations, {:prompt=>'Select Great Walk Location'}, :selected => nil, :id => :great_walks) %>

<%= observe_field("great_walks", :url => {:controller => "user", :action => "update_campsites"}, :update => "campsites_list", :with => "id")%> <%form_for :cart, :url => {:action => :add_to_cart} do |form|%>

Campgrounds
<%= form.select "campsite", %w{ ---- }, :class => "select_campsites" %>

Arrival Date:
<%= form.text_field :arrival_date %>

Nights:
<%= form.text_field :nights %>

Parents:
<%= form.text_field :parents %>

Children:
<%= form.text_field :children %>

Family Rate:
<%= form.check_box "family_claim",{}, "1", "0"%>

<%=submit_tag “Calculate”%>
<%end%>
<%= submit_tag “Next”,
:onclick => “if($(‘camp’).length - 1 > $(‘camp’).selectedIndex) $
(‘camp’).selectedIndex++; return false;” %>

PARTIAL:

Campgrounds
<%=select "camp", "id", @resultset %>

================================================================================

As you can see, I will be updating combo box in the partial. Also, what
I want to do is make two buttons inside the form and if I click one it
will change the value of combo box to next and if I click another some
action will be call (add_to_cart in my case).
Thanks again…

10

Erol F. wrote:

On Oct 10, 1:54�pm, Jay P. [email protected]
wrote:

Thanks Erol F. for the answer… but I just couldn’t make any use
of it coz it doen’t work and I’m using <%=javascript_include_tag
“prototype.js”%>. To make clear what I’m doing here is my code:

Try this instead:

<%= submit_tag “Next”, :onclick => “if($(‘camp_id’).length - 1 > $
(‘camp_id’).selectedIndex) $(‘camp_id’).selectedIndex++; return
false;” %>

Thanks a tonn man… it works sweet. So, :camp, :id in the partial
becomes ‘camp_id’ and represents the combo box???

11

On Oct 10, 6:04 pm, Jay P. [email protected]
wrote:

Thanks a tonn man… it works sweet. So, :camp, :id in the partial
becomes ‘camp_id’ and represents the combo box???

Posted viahttp://www.ruby-forum.com/.

Yeah, select :camp, :id generates a select tag with an id of “camp_id”
and a name of “camp[id]”.