• ベストアンサー
※ ChatGPTを利用し、要約された質問です(原文:SELECTでOPTION多数の場合のselectedされたOPTION項目表示)

SELECTでOPTION多数の場合のselectedされたOPTION項目表示

このQ&Aのポイント
  • selectのOPTIONの数が100ほどあり、selectの表示サイズをレイアウト上10に設定しています。選択されたデータをDBから読み、そのOPTIONをselectedとしているのですが、そのOPTIONが例えば上から80番目などにあると、すでに何か選択されているのか、あるいは何も選択されていなかったのか、いちいちスクロールして確かめないとわかりません。このような場合に、選択されている項目のOPTION selectedがselectの表示エリアの中にあらかじめ表示されるようにするにはどのようにしたら良いのでしょうか?
  • 質問文章からセンセーショナルなタイトルを生成する
  • SELECTでOPTION多数の場合、選択された項目が表示エリア内に表示される方法は?

質問者が選んだベストアンサー

  • ベストアンサー
  • ittochan
  • ベストアンサー率64% (2667/4137)
回答No.1

javascriptを使用してみました。 <HTML> <HEAD> <TITLE></TITLE> <SCRIPT LANGUAGE=javascript> <!-- function window_onload() { str = location.search; str = str.substring(1,str.length); if (str=="") no=0; else no=parseInt(str); select1.item(no).selected = true; } function submit1_onclick() { txt = select1.selectedIndex; window.location.href="select.htm?"+txt; } //--> </SCRIPT> </HEAD> <BODY onload="return window_onload()"> selectで選択した項目を自分に送る<br> <P><SELECT id=select1 style="WIDTH: 172px" size=2 name=select1> <OPTION value=aaaa>aaaa</OPTION> <OPTION value=bbbbb>bbbb</OPTION> <OPTION value=ccccc>cccc</OPTION> <OPTION value=ddddd>dddd</OPTION> </SELECT> <INPUT id=submit1 type=submit value=Submit name=submit1 LANGUAGE=javascript onclick="return submit1_onclick()"></P> </BODY> </HTML> >selectの表示サイズをレイアウト上10に設定しています。 サンプルでは2にしてます. >いちいちスクロールして確かめないとわかりません。 JavaScriptのSelectedでは下のdddddも表示されるようです。

その他の回答 (1)

  • isobeman
  • ベストアンサー率41% (17/41)
回答No.2

こんなのどうでしょうか? (ちなみに実装は、クライアント側のJavaScriptになってしまいますが、、、。) 2つのselectを作成して、左に選択項目をリストにしておき、右を空にします。 その後、左側のアイテムを選択し、何かボタン(追加とか)をクリックすると、右のリストに移動する。 右のリストで選択して、他のボタン(削除とか)をクリックすると、左のリストに移動する。 フォームの、onSubmitで右のボックスを全て選択してからsubmitする。 または、思い切ってチェックボックスにして全部並べてしまうとか言った代替え案はどうでしょうか?

関連するQ&A