プルダウン選択によるボタンの表示／非表示に関して

前へ 次へ
このQ&Aのポイント
  • プルダウン選択によるボタンの表示／非表示について教えてください。
  • プルダウンで選択された内容に応じてボタンの表示／非表示を制御したい場合、どのように記述すれば良いでしょうか？
  • 教えて頂きたいです。
回答を見る
  • ベストアンサー

プルダウン選択によるボタンの表示／非表示に関して

教えて下さい。 下のように、ONCHANGEイベントで、プルダウンにて選択された内容を、別のテキスト （'text'）エリアに表示させる記述をしましたが、今度は選択された内容によって、 ボタンの表示／非表示をコントロールしたいと考えています。 実際には、下の記述で、'BBB'が選択された場合のみ、***よりしたの"日"ボタンを 表示させたいと考えています。 どのように記述すれば良いでしょうか。。。 教えて頂きたいと思います。 <SCRIPT LANGUAGE="JavaScript"> function ChangeSelection(form, selection,num) { v = selection.value; form.text.value = v; } <FORM NAME="fm_a" print("<TD><input name='text'></input>\n"); print("</TD>\n"); print("<TD><select name='am_note' ONCHANGE='ChangeSelection(this.form, this)'>\n"); print("<option value=''></option>\n"); print("<option value='AAA'>AAA</option>\n"); print("<option value='BBB'>BBB</option>\n"); print("<option value='CCC'>CCC</option>\n"); print("</select>\n"); print("</TD>\n"); ************************************************************** print("<TD>\n"); print("<input name='Cal' type='button' value='日'\n"); print("</TD>\n");

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

  • ベストアンサー
  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.3

Ｎｏ2です。 ＞'BBB'が選択された場合のみ、***よりしたの"日"ボタンを ＞表示させたいと考えています。 ではなかったの？ ＞しかし、逆にAAAとCCCの時に表示できなくなってしまい 『ＢＢＢのみ表示』＝『AAAとCCCの時に表示しない』 だと思うのだけれど… ＞この逆はどのようにすれば良いでしょうか？？？ ＢＢＢのみ非表示ということ？？ だとするなら、inlineとnoneを入れ替えればいいだけ。 sel.form.elements['Cal'].style.display = sel.value=='BBB'?'none':'inline'; 何を質問したいのかよくわからない・・・

その他の回答 (2)

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.2

よくわらないけど、要領のみ。 <html> <head> <script type="text/javascript"> <!-- function ChangeSelection(sel) { sel.form.elements['text'].value = sel.value; sel.form.elements['Cal'].style.display = sel.value=='BBB'?'inline':'none'; } //--> </script> </head> <body> <form name="fm_a" action="" method=""> <input name="text" value=""> <select name="am_note" onchange="ChangeSelection(this)"> <option value="" selected></option> <option value="AAA">AAA</option> <option value="BBB">BBB</option> <option value="CCC">CCC</option> </select> <input name="Cal" type="button" value="日" style="display:none"> </form> </body> </html>

yurix_1
質問者

お礼

ありがとうございます。 なんとか表示させない事ができました。 しかし、逆にAAAとCCCの時に表示できなくなってしまい。。。 sel.form.elements['Cal'].style.display = sel.value=='BBB'?'inline':'none'; この逆はどのようにすれば良いでしょうか？？？

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

元ソースがむちゃくちゃ・・・少なくともこのまま書いても HTMLとしてもきちんと処理されないですよね？ タグが途中できれてるし、閉じていないし、不要な閉じるタグがあるし、 テーブルもなく、行指定もないのにいきなりtdで処理してるし・・・ javascript以前にそのあたりをもう少しつめてから再質問した方が よいのでは？

yurix_1
質問者

補足

ご回答ありがとうございます。 申し訳ありません。。。　 ソースはこの質問エリアに入るようにかなり省いて しまっています。 確かにこのままでは動きません。。。

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • プルダウン選択後の手入力優先に関して

    教えて下さい。 プルダウンを選択し、選ばれたものを別テキストに表示するような事を したいと考えています。 現在、下記のように記述をしており、上記の内容は実現できていますが、 その際に、表示される側のエリアに手入力を可とし、入力があった場合は、 javasriptの選択項目を無効（手入力を優先）としたいと考えています。 どのような方法があるでしょうか。。。 <SCRIPT LANGUAGE="JavaScript"> function ChangeSelection(form, selection) { v = selection.value; form.text_note.value = v; } </SCRIPT> print("<TD NOWRAP><FONT SIZE='3'><B>【行　　先】</B></FONT></TD>\n"); print("<TD NOWRAP SIZE='30'><input name='text_note' VALUE=$out_goto></input>\n");　//$out_gotoにはphpにてテーブルから読み込まれた情報が初期値として格納されています。 print("</TD>\n"); print("<TD><select name='am_note' ONCHANGE='ChangeSelection(this.form, this)'>\n"); print("<option value='　'></option>\n"); print("<option value='自席' >自席</option>\n"); print("<option value='離席' >離席</option>\n"); print("</select>\n"); print("</TD>\n"); よろしくお願いします。

  • プルダウンの初期値に関して２

    前の質問と同じ内容となってしまいますが、プルダウンの前回値が どうしても取得できません。。。 ソースは以下のように記述し、selected属性を用いて初期値に前回値 を指定しているような格好をとっています。 何か記述が間違っているのでしょうか。。。。 print("<TR>\n"); print("<TD NOWRAP><FONT SIZE='3'><B>【行　　先】</B></FONT></TD>\n"); print("<TD NOWRAP SIZE='30'><input name='text1' VALUE=$out></input>\n"); print("</TD>\n"); print("<TD><select name='am_note' ONCHANGE='ChangeSelection(this.form, this)'> <option value='　'　　　　　　　　　　　　　　　　　　　　　 <?php if('$out_goto'=='　'){ echo' selected=?'selected?''; } ?> 　 <option value='自席' style='background-color:#FFFFFF; color:#3366FF' <?php if('$out_goto'=='自席'){ echo' selected=?'selected?''; } ?> 自席 </select>\n"); print("</TD>\n"); print("</TR>\n"); 教えて下さい。

    • ベストアンサー
    • PHP
  • プルダウンの初期値に関して

    教えて下さい。 PHPとJavascript、DBはMySWLを使用してプルダウンにて選択した 内容を、別のテキストエリアに表示させるような事をしようとしています。 javascriptで選択されたものを別エリアに表示させ、さらには前回値をテキストエリアに再表示させる事は可能ですが、次に登録しようとした際に、プルダウンを選択していないとせっかく登録した内容がプルダウンの初期値で上書きさせれてしまいます。 何か、テキストにデータが存在した場合には、プルダウンの情報で上書きしないか、そもそもプルダウンの内容を覚えておくような事はできないでしょうか。。。 現在作成している記述です。 print("<TR>\n"); print("<TD NOWRAP><FONT SIZE='3'><B>【行　　先】</B></FONT></TD>\n"); print("<TD NOWRAP SIZE='30'><input name='text1' VALUE=$out></input>\n"); print("</TD>\n"); print("<TD><select name='am_note' ONCHANGE='ChangeSelection(this.form, this)'> <option value='　'>　　　　　　　　　　　　　　　　　　　　　 <option value='自席' style='background-color:#FFFFFF; color:#3366FF'>自席 </select>\n"); print("</TD>\n"); print("</TR>\n"); よろしくお願いします。

    • ベストアンサー
    • PHP
  • プルダウンのメニューを別ファイルに…

    掲示板の投稿フォームにある print "<input type="text" name="name">"\n"; の部分を↓に変更 print "<select name=\"name1\">"; print "<option value=\"aaa\">aaa</option>"; print "<option value=\"bbb\">bbb</option>"; print "</select>"; print "<select name=\"name2\">"; print "<option value=\"aaa\">aaa</option>"; print "<option value=\"bbb\">bbb</option>"; print "</select>\n"; $name = $FORM{'name1'} . $FORM{'name2'}; このままですと、特に何の問題もなく使えるのですが、 print "<option value=\"aaa\">aaa</option>"; print "<option value=\"bbb\">bbb</option>"; の部分をname1　name2共に随時、追加や編集等を行いたい為、別ファイルで管理したいのです。 別で、name1.txt　name2.txtを作って、そこに aaa bbb というように、一列に一項目を書いて管理をしたいのです 色々調べた結果、配列（Array）を使えばいい…という所まではいきついたのですが、そこから先が分からず、立ち往生しております どなたか、ご教授頂けませんでしょうか？ よろしくお願い致します

    • ベストアンサー
    • CGI
  • プルダウンのコントロールに関して

    プルダウンのコントロールに関して 教えて下さい。 今、以下のようなソースを記述し、プルダウン選択で"休み"が選択された場合のみ。 テキスト入力欄を表示させるような仕組みを作成しました。 但し、この場合、Cookie等を使ってデフォルトで前回値を"休み"と選択した場合は 他のものを選択し、さらにもう１度"休み"を選択しないと表示されないかと思われます。 上記のように前回値で立ち上げた際に、既に"休み"が選択された場合でも、切り替えを 行う事なくテキスト入力欄を表示させるような事は可能なのでしょうか？？？ わかりにくい内容で申し訳ありません。 よろしくお願いします。 <script type="text/javascript"> function ChangeSelection(form, selection) { var text_note = form.elements["text_note"]; if (selection.value=="休み" || selection.value=="出張") { text_note.style.display = "block"; }else{ text_note.style.display = "none"; } } </script> </head> <body> <FORM NAME="fm_a" ACTION="koudou_update2.php" METHOD="POST"> <TD NOWRAP SIZE="30"><input name="text_note" style="width:100%;display:none;" VALUE="$out_goto"></input></TD> <TD><select name="am_note" ONCHANGE="ChangeSelection(this.form, this)" style="width:145px;"> <option value=""></option> <option value="自席" style="background-color:#FFFFFF; color:#3366FF" $sqlline1>自席</option> <option value="離席" style="background-color:#3366FF; color:#FFFFFF" $sqlline2>離席</option> <option value="帰宅" style="background-color:#FFFFFF; color:#3366FF" $sqlline3>帰宅</option> <option value="午前休暇" style="background-color:#3366FF; color:#FFFFFF" $sqlline4>午前休暇</option> <option value="午後休暇" style="background-color:#FFFFFF; color:#3366FF" $sqlline5>午後休暇</option> <option value="休み" style="background-color:#3366FF; color:#FFFFFF" $sqlline5>休み</option> <option value="出張" style="background-color:#3366FF; color:#FFFFFF" $sqlline13>出張</option> </select></TD> </FORM> </body> </html>

  • 文字の表示色を変えたい

    いつも、ありがとうございます。 下の記述で、＜他社より安い場合は・・・＞の文字を 青くしたいのですが、いろいろとやっても、 青文字になってくれません。 500　Internal　Server　Error　になってしまいます。 どうやれば、青文字になりますか？ **********記述文************************ print "<table>\n"; print "<tr>\n"; print "<td>\n"; print "<form action=\"$script\" method=\"POST\" target=\"_blank\">\n"; print "<input type=hidden name=mode value=note>\n"; print "<input type=hidden name=job value=blank>\n"; print "<input type=submit value=ご　利　用　方　法></form>\n"; print "</td><td>\n"; print "<form action=\"$home\" method=\"POST\" target=\"_self\">\n"; print "<input type=hidden name=mode value=_top>\n"; print "<input type=hidden name=job value=blank>\n"; print "<input type=submit value='ト ッ プ へ 戻 る'>\n"; print "</form></td></tr></table> <他社より安い場合は、ご相談ください。>

    • ベストアンサー
    • CGI
  • プルダウンによる表示制御方法

    プルダウンの選択内容による表示の切り替えを行いたいです。 例えば、AとCを選択すると下にあるテキストボックスが非表示になり Bを選択するとテキストボックスが表示するように制御を行いたいです。 <table align="center" border="0" cellpadding="0" cellspacing="0"> <tr><td> <form name="a"> <SELECT NAME="b"> <OPTION SELECTED> <OPTION VALUE="0">A <OPTION VALUE="1">B <OPTION VALUE="2">C </SELECT> </td></tr> <tr><td> <input type="text" size="6" maxlength="5" name="text1" value=""> </td></tr> </form> </table></form></td></tr></table> すみませんが、よろしくお願い致します。

    • ベストアンサー
    • HTML
  • プルダウンのoptionの表示・非表示はできますか？

    JavaScriptを使ってプルダウン操作をしております。 一つ目のプルダウンで選択したあと2つ目のプルダウンのoptionの部分だけ表示・非表示をしたいのです。そんなことはできるのでしょうか？ 下のソースで説明しますが、一つ目のリストで「あいうえお」を選択した時点で2つ目の選択リストの「ひらがな1」と「ひらがな2」だけを選択できるようにしたいのです。「カタカナ1」「カタカナ2」は非表示もしくは選択不可にできればいいのですが。 一つ目のプルダウンリスト <select name="formtype" onchange="form_indicate();"> <option value="AAA">あいうえお <option value="BBB">アイウエオ </select> 二つ目のプルダウンリスト <select name="formtype2"> <option value="aaa">ひらがな1 <option value="bbb">ひらがな2 <option value="ccc">カタカナ1 <option value="ddd">カタカナ2 </select>

  • ＣＧＩプログラムでのボタン表示のさせかた

    print "<form action=\"$script\" method=\"POST\" target=\"_blank\">\n"; print "<input type=hidden name=mode value=note>\n"; print "<input type=hidden name=job value=blank>\n"; print "<input type=submit value="説明表'>"</form>\n"; print "<form action=\"$home\" method=\"POST\" target=\"_blank\">\n"; print "<input type=hidden name=mode value=_top>\n"; print "<input type=hidden name=job value=blank>\n"; print "<input type=submit value='トップ'></form>\n"; というＣＧＩプログラムの文章があるのですが、 上記の記述で実行すると、 「説明表」ボタンと、「トップ」ボタンが縦に並んで表示されてしまいます。 これを、横に表示させるようにするには、 どのように変更すばいいのでしょうか？ 参考になるかわかりませんが、「説明表」をクリックして表示される文章は、 他のＣＧＩプログラムの中に記述されています。

    • ベストアンサー
    • CGI
  • プルダウンで選択したCGIを動かしたい（ACTION=""をプルダウンで変更するには？）

    プルダウンで選択したCGIを動かしたい（ACTION=""をプルダウンで変更するには？） 以下の <option value="test1.cgi">テスト１　 <option value="test2.cgi">テスト２ <option value="test3.cgi">テスト３ <option value="test4.cgi">テスト４ ４つのプルダウンメニューを選択して、それぞれ別のCGIを動かすには どうしたらできますか？ よかったら教えて下さい。javascriptで出来そうな気がするのですが… <FORM name="testname" method="post" ACTION="/cgi-bin/??????" > <TABLE> <TR><TD>　テスト</TD> <TD bgcolor="#FFFFFF"> <SELECT name=""> <option value=""> <option value="test1.cgi">テスト１　 <option value="test2.cgi">テスト２ <option value="test3.cgi">テスト３ <option value="test4.cgi">テスト４ </SELECT></TD> </TR> <TR> <TD bgcolor="#cccccc" width="150">　開始日</TD> <TD bgcolor="#FFFFFF"> <input name="daysS" type="text" size="8"> </TD> </TR> <TR> <TD bgcolor="#cccccc" width="150">　終了日</TD> <TD bgcolor="#FFFFFF"> <input name="daysE" type="text" size="8"> </TD> </TR> </TABLE> <BR> <INPUT type="submit"name="send"value="開始"> <INPUT type="reset" name="reset" valiu="消去"> </FORM>

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する