selectタグでURLに値を送る方法が知りたい

selectタグでURLに値を送る方法が知りたいです。

html
1  <form action="products/index/" method="get">
2    <select>
3      <option value="9">9</option>
4      <option value="12">12</option>
5      <option value="15">15</option>
6    </select>
7    <input type="submit" value="送信">
8  </form>

この実装でセレクトボタンから値を選んで送信すると、
URLは"http://localhost:3000/products/index/?"になります。
URL最後の？にoptionタグ内から値を送るにはどうすればよいのでしょうか？

できればRuby On Railsのコードも知りたいです。何卒よろしくお願いします。

行動規範の内容に同意します

回答2件

<select>にname属性を指定してください。たとえばname="hoge"のように指定した場合、http://localhost:3000/products/index/?hoge=9のような値が送信されます。

投稿2018/10/12 07:00

maisumakun

総合スコア145192

s_diff

2018/10/12 07:25

?hoge=9のようにならないようにしたいと思っているんです。 javascriptを使わずに "http://localhost:3000/products/index/9" のようにするにはどうしたらいいですか？

maisumakun

2018/10/12 07:34

無理です。

s_diff

2018/10/12 07:58

そうですか。わかりました。ありがとうございました。

行動規範の内容に同意します

ベストアンサー

javascript
1<script>
2window.addEventListener('DOMContentLoaded', function(e){
3  document.querySelector('#f1').addEventListener('submit',function(e){
4    var t=e.target;
5    e.preventDefault();
6    var url=t.getAttribute('action')+t.querySelector('select').value;
7    location.href=url;
8  });
9});
10</script>
11<form action="products/index/" method="get" id="f1">
12<select>
13<option value="9">9</option>
14<option value="12">12</option>
15<option value="15">15</option>
16</select>
17<input type="submit" value="送信">
18</form>