• ベストアンサー

2つのプルダウンメニューで、同じものを選べないようにする

ふたつの選択肢を選ぶために、プルダウンメニューがふたつ並んでいます。  例えばメニュー1の選択肢 ・A ・B ・C ・D  でAを選んだとき、メニュー2の内容が ・B ・C ・D  になるようにしたいのですが、どうすればいいでしょうか?  チェックボックスで選べる数をふたつまでにする、というのも方法としてはありなんですが、今回は都合上プルダウンメニューで実装したいのです。ご教授お願いします。

  • rusya
  • お礼率56% (167/295)

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

  • ベストアンサー
noname#137826
noname#137826
回答No.2

こんな感じでどうでしょう? 1つ目の選択肢を選んだら、 ・2つ目の選択肢を一度全部消す ・1つ目で選ばれたものを除いて、2つ目の選択肢を追加する というやり方です。 --- <html> <head> <script type="text/javascript"> var defaultOptions = [ {'value':'a', 'txt':'A', 'selected':true}, // <option value='a' selected="selected">A</option> {'value':'b', 'txt':'B'}, {'value':'c', 'txt':'C'}, {'value':'d', 'txt':'D'} ]; window.onload = function() { var s0 = document.getElementById('s0'); var s1 = document.getElementById('s1'); appendOptions(s0); appendOptions(s1, s0.selectedIndex); s0.onchange = function() { var s1 = document.getElementById('s1'); removeOptions(s1) appendOptions(s1, this.selectedIndex) } function appendOptions(sel) { for (var i = 0, n = defaultOptions.length; i < n; i++) { if (i == arguments[1]) continue; var op = document.createElement('option'); op.value = defaultOptions[i].value; op.innerHTML = defaultOptions[i].txt; if (defaultOptions[i].selected) op.selected = 'selected'; sel.appendChild(op); } } function removeOptions(sel) { while (sel.getElementsByTagName('option').length) { sel.removeChild(sel.getElementsByTagName('option')[0]); } } } </script> </head> <body> <form> <select id="s0"></select> <select id="s1"></select> </form> </body> </html>

rusya
質問者

お礼

回答ありがとうございます。 私が考えていたものにかなり近く、無事動作確認できました。ありがとうございました。

その他の回答 (2)

  • toboy88
  • ベストアンサー率0% (0/1)
回答No.3

use AJAX

rusya
質問者

お礼

回答ありがとうございます。 ajaxは以前一度触ったことがあるので、これを機に見直してみようと思います。

  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.1

その作業によって消してしまうと、別の選択肢を選んだときに、 復活してまた別の選択肢を消すと言う面倒な作業になります。 同じものをえらんだら、デフォルト値にもどるという程度が実装する 妥当なラインだと思いますが・・・ <script> function check(obj){ var f=obj.form; for(var i=0;i<f.length;i++){ if(f[i]!=obj && f[i].value==obj.value && obj.value!=""){ obj.selectedIndex=0; break; } } } </script> <form> <p> <select name="s1" onChange="check(this)"> <option value="">選択して</option> <option value="A">A</option> <option value="B">B</option> <option value="C">C</option> <option value="D">D</option> </select> <select name="s2" onChange="check(this)"> <option value="">選択して</option> <option value="A">A</option> <option value="B">B</option> <option value="C">C</option> <option value="D">D</option> </select> </p> </form>

rusya
質問者

お礼

回答ありがとうございます。 なるほど、同じものを選んだらデフォルト値に戻すというのもアリですね。参考にさせていただきます。

関連するQ&A

  • プルダウンメニューの自動変更

    プルダウンメニューAとプルダウンメニューBがあります。 プルダウンメニューAでは「A-1」と「A-2」が、 プルダウンメニューBでは「B-1」と「B-2」が 選択できるメニューとして指定されています。 プルダウンメニューAで「A-1」を選択すればプルダウンメニューBで「B-1」が、 プルダウンメニューAで「A-2」を選択すればプルダウンメニューBで「B-2」が 自動的に選択されるようにプログラムすることは可能でしょうか? どなたかご教授ください。

  • 2つのプルダウンメニューを使用したフレームラベルへの移動

    はじめまして。 お世話になります。 Flashムービー内で 2つのプルダウンメニューを組み合わせた フレーム移動をさせたいのですが方法がわかりません。 例えば、 1つ目のプルダウン(「A」~「D」までアルファベット順のメニュー)で「A」を選択し、 2つ目のプルダウン(「1」~「9」までの数字順のメニュー)で「1」を選択したら、「A1」というフレームラベルへジャンプするという仕組みを実装したいのですが、方法が分かりません。 プルダウンメニューが一つの場合だと任意のフレームラベルへジャンプさせるという方法は分かるのですが、2つを連動させるというのが、どうしても分かりません。 お教えいただけると大変助かります。 よろしくお願いいたします。

  • プルダウンメニューの選択肢の保持について

    こちらにはだいぶお世話になっています。 perlとpostgresを使用してcgiを作成しているのですが、 下記のコードでプルダウンメニューにDBの値を入れて、 DBにデータが追加されてもプルダウンにもデータが追加されているプルダウンメニューを作りました。 $sql="select * from testtable order by code"; $result = $conn -> prepare($sql1); $ref = $result -> execute; while(@ref = $result->fetchrow){ $options.="<option value='$ref[0]'>$ref[1]</option>\n"; } $select="<select name=''>\n<option value=''>選択してください</option>\n$options</select>\n"; print "$select"; データの検索時にこのプルダウンメニューを使っているのですが、選らんだ選択肢を例えばBとして 送信すると、一番上の「選択してください」に戻ってしまします。 これを送信してもその時選択した選択肢を残すやり方を教えて頂けますでしょうか? testtableの中身:      プルダウンメニュー化 |code|name|      |選択してください▼| | 1 | A |         |    A    | | 2 | B |        → |    B    | | 3 | C |         |    C    | | 4 | D |         |    D    |

  • エクセルで家計簿のようにプルダウンメニューの項目の数字を計算したい

    エクセルで家計簿のようにプルダウンメニューの項目の数字を計算したい わからないのでご教授をお願いします。 エクセルで家計簿を作っています。 その中で、次のような計算をしたいと思っています。 (記号はセルの番号と理解してください。) ・A1にプルダウンメニューを作り、A口座又はB口座を選択し、B1に入金された金額を入れる。 ・C1にはA口座の残額、D1にはB口座の残額が記載されている。 ・例えば、A1でA口座を選び、B1にはそこには100円入金があったことを記載する。 ・そうすると、C1に書いてあるA口座の残額が100円増える。 という感じです。 プルダウンメニューで選んだ口座によってどちらかの口座の残額が変動するようにするための方法を 教えてください。

  • プルダウンメニューからチェックボックスを表示したい

    php、javascript、mysqlを使用し、プルダウンで選択後、チェックボックスを表示させる仕組みを作りたいのですが、 どうすればよいのか分かりません。 どなたか力を貸して頂きたく思います。 例えば下記のようなTBLがあったとします。 ■TBL:oya  oyaコード  10  20  30 ■TBL:ko  oyaコード    koコード  10        1100  10        1200  10        1300  20        2100  20        2200  30        3100 TBL 「oya」 をプルダウンメニューにセット。 プルダウンメニューを選択する度にTBL 「ko」を呼び出し、同ページ内にチェックボックスとして表示させたいと考えています。 例) ・10が選択されたら  「1100」、「1200」、「1300」のチェックボックスを表示する プルダウンメニューへのセットは出来たのですが、プルダウン選択後の「ko」を呼び出す箇所が分かりません。 php Mysql javascript で実現したいと考えております。 サンプルページでもいいですので、何かありましたら教えて下さい。 お分かりになる方よろしくお願いいたします。

  • プルダウンメニューに連動するチェックボックスのdisable切り換え

    こんにちわ。 表記の件ですが、プルダウンメニューに連動するチェックボックスのdisableを切り換えたいと思っているのですが、なかなか上手くいきません・・・。 例えばプルダウンメニューにおいて ・食べ物 ・生き物 ・果物 ・穀物 というようなメニューがあり、さらにチェックボックスとして ・お米 ・りんご ・さかな ・みかん というチェックボックスがあるとします。 この場合、[食べ物]を選択すると全てが選択できるようになり、[果物]を選択すると[りんご]と[みかん]以外は無効(チェックボックスの選択ができない状態)となるスクリプトを作成したいということです。 もし、先行していずれかのチェックボックスが有効になっていて、プルダウンメニューを切り換えた場合はアラートと同時にチェックボックスをリセットするようできると尚素敵です。 皆様のお知恵を拝借できればと思います。 何卒お力添えいただければ幸いです。

  • ページ左にプルダウンメニューをつけたいです。

    ページ左にプルダウンメニューをつけたいです。 ページ数がとても多く、目次だけですごい量になってしまうので、 何とか苦なく見られるようにプルダウン式にできればと思っています たとえば、下記のように普段表示されていて、 Aについて Bについて Cについて 「Aについて」をクリックすると下記のようにAの中の 各ページへのリンクが現れるようにしたいです。 Aについて  ・あいうえお  ・かきくけこ  ・さしすせそ Bについて Cについて こういったプログラムを紹介してくれているページがあれば 教えていただけますでしょうか。 よろしくお願いいたします!

  • プルダウンメニューからPDF表示

    プログラミング、初心者です。 JavaScriptを使って、二つのプルダウンメニューをコンボ(1つ目に選択したメニューの内容で、2つ目を変化)させて、GO!ボタンを押すと2つ目のメニューで指定したPDFを別ウィンドウで表示させるようにしたいです。具体的には、1つ目のメニューで、Aを指定すると2つ目でA-1,A-2,A-3,,,。1つ目のメニューで、Bを指定すると2つ目でB-1,B-2,B-3,,,。というふうにしたいです。その場合どのように記述すればいいのでしょうか? また、2つ目のメニューの選択肢がかなり多くなった場合でも、きちんと表示されるでしょうか? ご回答よろしくお願いしますm(__)M

  • プルダウンメニュー

    ある問題集の解答を掲載したいと思っています。 問題集は1~5章まであり、各章に1.1や3.1A等の節があり、各節にAからBないしC問題があり、その中に111,112,113...というふうに問題があります。また巻末に付録問題と総合問題があります。(付録、総合問題にはAやB問題というのはなく単に問題があるだけです) これらを、プルダウンメニューのコンボ(1つめに選んだメニューによって2つめで選ぶメニューを変化させ、「表示」ボタンで解答のPDFを表示する)の形にしたいです。 具体的には、1つ目で1.1や3.1A等の節及び付録問題、総合問題を表示させ、2つ目でAからBないしC問題の選択肢を表示させたいです。ですが、1つ目で付録や総合を選んだ場合には単に「問題」だけを表示させたいです。問題はA、B問題ごとにPDF表示させるつもりです。 本で調べたのですが複雑なのはわかりませんでした。わかる方おられましたら、お教え下さい

  • エクセル プルダウンメニューリンク

    Excel 2003 です。     プルダウンメニューから参照されるデータが入力されるテーブルを複数シート(3つ)に貼り付けて、全てリンクさせたいのですが可能でしょうか?  "SheetAAA" A1 セルに プルダウンメニュー がありこちらは他作業シート"SSS" にリンクしていて、例えば 鉛筆/消しゴム/定規 などの項目を選択すると作業用シートで対応した 50円/100円/300円 などが B1 セルに入力されます。  この"SheetAAA" A1セルに あるものと同じものを "SeetBBB" A10 に貼り付けてB10にも金額を、そして"SheetCCC" の D10にも貼り付けてE10に金額、しかしどのシートのプルダウンメニューから商品を選択しても(例えば鉛筆)全てのシートに同じ値(鉛筆)が表示され、隣に対応金額が出るようにしたいのですが。  簡単に言うと、全てのシートで同時に動くプルダウンメニュー・・でしょうか。 分かる方いたらお願いします。   

専門家に質問してみよう