プルダウンで選択した値をもってきたいのですがやりかたがわかりません。
<FORM name="selectForm" action="../select.jsp" method="post">
<SELECT size=1 name="selectList" style='{width:200}'>
<OPTION value=-1 selected>-選択-</option>
<OPTION value=1>選択肢1</OPTION>
<OPTION value=2>選択肢2</OPTION>
<OPTION value=3>選択肢3</OPTION>
<OPTION value=4>選択肢4</OPTION>
</SELECT>
<INPUT type="hidden" name="selectID" value="" />
・・・・・略・・・・・・
<INPUT type="image" alt="入力" width=98 src="../select.gif" value="" border="0" />
</FORM>
INPUTタグのname="selectID"のvalueにプルダウンで選択された選択肢のvalueの値をもってきたい。
可能でしょうか?
<FORM name="selectForm" action="../select.jsp" method="post">
<SELECT size=1 name="selectList" style='{width:200}' onchange="javascript:document.forms.selectForm.selectID.value = this.options[this.selectedIndex].value;">
<OPTION value=-1 selected>-選択-</option>
<OPTION value=1>選択肢1</OPTION>
<OPTION value=2>選択肢2</OPTION>
<OPTION value=3>選択肢3</OPTION>
<OPTION value=4>選択肢4</OPTION>
</SELECT>
<INPUT type="hidden" name="selectID" value="" />
<INPUT type="image" alt="入力" width=98 src="../select.gif" value="" border="0" />
</FORM>
selectとかinputとかにidを付けるほうがスマートかもしれませんが。
http://javascript123.seesaa.net/article/101434703.html
こちらを参考にして function Selc(Obj)を作成して やってみてください。
<script type="text/javascript"></p> <p><!--</p> <p>function select_option()</p> <p>{</p> <p> // 選択されているOPTIONの位置(上から何番目か?)</p> <p> var selected_no = document.selectForm.elements[ "selectList" ].selectedIndex;</p> <p> // 選択されているOPTIONのvalue値を取得</p> <p> var selected_option_value = document.selectForm.elements[ "selectList" ].options[ selected_no ].value;</p> <p> // hiddenのvalueに代入</p> <p> document.selectForm.selectID.value = selected_option_value;</p> <p> return true;</p> <p>}</p> <p>//--></p> <p></script>
<FORM name="selectForm" id="selectForm" action="../select.jsp" method="post">
<SELECT size=1 name="selectList" id="selectList" style='{width:200}' onchange="javascript:select_option();">
<OPTION value=-1 selected>-選択-</option>
<OPTION value=1>選択肢1</OPTION>
<OPTION value=2>選択肢2</OPTION>
<OPTION value=3>選択肢3</OPTION>
<OPTION value=4>選択肢4</OPTION>
</SELECT>
<INPUT type="hidden" name="selectID" value="" />
</FORM>
1.scriptタグ内で、プルダウンが変更されるたびに動くjavascriptの関数を作成する。
外部ファイルで読み込んでもいいし、とりあえずHTMLのSELECTタグよりは手前に記述する。
2.SELECTタグの「onchange(プルダウンが操作された場合に実行されるイベントです。)」に、実行したい関数名を書く。
3.「1.」の関数内で選択されているOPTIONタグのvalue値を取得し、hiddenのvalueに代入する。
パッと思いついたままに書いたのですが、たぶんこれで動くはずです。
エラーが出たらいろいろ調べてみてください。
僕は普段は違う形式で記述しますが、こちらのほうがわかりやすいと思うので・・・。
ありがとうございます。
<FORM name="selectForm" action="../select.jsp" method="post">
<SELECT size=1 name="selectList" style='{width:200}' onchange="javascript:document.forms.selectForm.selectID.value = this.options[this.selectedIndex].value;">
<OPTION value=-1 selected>-選択-</option>
<OPTION value=1>選択肢1</OPTION>
<OPTION value=2>選択肢2</OPTION>
<OPTION value=3>選択肢3</OPTION>
<OPTION value=4>選択肢4</OPTION>
</SELECT>
<INPUT type="hidden" name="selectID" value="" />
<INPUT type="image" alt="入力" width=98 src="../select.gif" value="" border="0" />
</FORM>
selectとかinputとかにidを付けるほうがスマートかもしれませんが。
簡単な方法で実装できたました。
ありがとうございました。
こんな感じでしょうか。
selectForm.selectID.value = selectForm.selectList.options[selectForm.selectList.selectedIndex].value;
selectForm.selectList.options[★].value →selectFormというフォームにあるselectListというプルダウンメニューの★番目のvalue値を取得する。
selectForm.selectList.selectedIndex → selectFormというフォームにあるselectListというプルダウンメニューの何番目が選択されているか。
selectForm.selectList.options[selectForm.selectList.selectedIndex].value → 選択中項目が何番目かを調べ、その○番目(選択中項目)のvalue値を調べる。
http://www.openspc2.org/JavaScript/ref/form/selIndex.htm
ところで、不都合がなければプルダウンメニューの選択項目のデータを直接JSPに送信してもいいのではないでしょうか…。
丁寧な説明をありがとうございます。
意味が理解できました。
簡単な方法で実装できたました。
ありがとうございました。