How to get a <select> box to change the url?

Hello all,

I have a list of games that I want to filter by # of players and
category. I want to be able to list either or both parameters and
have it work. I don't know how to make the players <select> box
generate the GET requests I want (see below)

The urls would look like the following. As you can see, right now I
don't want to have to specify all the parameters

/games?players=2&category=3
/games?category=3
/games?players=2
/games

The _filter template includes a <select> box for the # of players, and
links for the categories. The categories generate the right urls if
they use the following helper.

  def filtered_games_path (p)
    temp = params.dup

    p.each do |key, value|
      temp[key] = value
    end

    games_path(temp)
  end

So, something like this: <%= link_to category.name,
filtered_games_path (:category => category.id ) %> would translate to
either /games?category=N or /games?players=M&category=N, depending on
whether or not players was already one of the parameters.

But now I need to do the same thing for a select box. I want it to
make a get request as soon as it is changed -- so it's just a fancy
link that allows you to change which # you are sending for the players
variable.

How should I do this? I can do it with javascript, but I want to
generate the url with rails, so I don't have to repeat the code that
merges the parameters.

Thanks, and let me know if that doesn't make sense :slight_smile:

I think the only way you'll get any reasonably consistency is using
JavaScript. Select boxes don't work as hyperlinks because they don't
make any sort of request to the server. They do however support
JavaScript events such as onchange. And, even this is on the verge of
being obsoleted by observers inside JavaScript files. I believe that
technique is referred to as "Unobtrusive JavaScript."

Thanks for the confirmation. I guess the only way of doing it is something like the following.

… etc …

Then, I can write a javascript component (with jquery, much like you described to replace VALUE with the selected value and submit the url).

$('select.link').change(function () {

	var value = $(this).val();

	var location = $(this).attr('href').replace(/VALUE/, value);

	window.location = location;

});

It still seems kind of kludgey to have to use a string hook like that. Any suggestions?

Thanks for your help!

~sean