select another value in a combo box with a button click

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.

Hi Jay,

Jay Pangmi 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

Jay Pangmi 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.

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.

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;" %>

Erol Fornoles wrote:

<%= submit_tag "Next", :onclick => "if($('camp').length - 1 > $('camp').selectedIndex) $ ('camp').selectedIndex++; return false;" %>

Thanks Erol Fornoles 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:

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

Erol Fornoles wrote:

<p> � <label for="camp location">Campgrounds</label><br/> � <%=select "camp", "id", @resultset %> </p>

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 <div> 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 <div> and this <div> is getting updated with the following partial file:

_campsites.rhtml

Try this instead:

<%= submit_tag "Next", :onclick => "if($('camp_id').length - 1 > $ ('camp_id').selectedIndex) $('camp_id').selectedIndex++; return false;" %>

Erol Fornoles wrote:

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