入力フォームでセレクトボックスなどの項目で値を変更したときに、いちいちsubmitボタンを押さなくても、変更した値にもとづいて処理を実行する方法を紹介します。
入力フォームとJavascript
下記のようにフォームの項目のタグ内にonChangeオプションを設定し、値を変更したときに呼び出すJavascriptの関数を記述します。選択した値を引数として使いたいときは、引数をthis.valueとします。
<select name="search" onChange="myfunc(this.value)"> <option value="A">ああああああ</option> <option value="B">いいいいいい</option> <option value="O">ううううううう</option> </select>
呼び出されるJavascriptの関数は、例えば下記のような感じです。下記は、URLに/?option=選択した値を追加してリダイレクトする関数です。一覧ページの並び順を高い順や安い順にするときに使うようなイメージです。
<script type="text/javascript"> function myfunc(value) { window.location.replace('/?option=' + value); } </script>