- ベストアンサー
フォームメール ラジオボタンＯＮでリストボックス表示
現在グッズデザインの注文フォームを構築中なんですが、 出来る限り分かりやすい注文フォームを構築したいと考えています。 で！ 『デザイン加工を希望する』のラジオボタンをチェックした時のみ 各デザイン部分のリストボックスが表示されるようにしたいのですが 例） ○ デザイン加工を希望する（希望の方はチェックをお願いします。） ラジオボタンをチェックすれば、以下の項目が表示される ●●部分の色『リストボックス』 ●●部分の形『リストボックス』 ●●部分の向き『リストボックス』 という感じです。 もう少し分かりやすい感じですと、 注文フォームで 『○ ご注文者と送り先が違う場合はチェックして下さい』 で、チェックすると名前、住所、電話など入力できるフォームが表示される 見ないな感じです。 この様な内容を解説しているページをご存知でしょうか？ ここが良いよ！的なWebサイトがありましたら教えてください。 宜しくお願い致します。
- torento19
- お礼率51% (25/49)
- JavaScript
- 回答数2
- ありがとう数4
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
「javascript 表示 非表示」で検索すると参考になるページが見つかると思います。 #1さんのサンプルとも似ていますが一応。 <html> <head> <script type="text/javascript"> function optionView(condId,targetBlockId) { document.getElementById(targetBlockId).style.display = (document.getElementById(condId).checked)?'block':'none'; } </script> </head> <body> <form> <div> <label for="jouken1" onclick="optionView(this.htmlFor,'targetblock1')">デザイン加工を希望する場合はチェックして下さい</label> <input type="checkbox" onclick="optionView(this.id,'targetblock1')" id="jouken1"> <ul id="targetblock1" style="display:none"> <li>●●部分の色 <select><option>選択してください</option></select></li> <li>●●部分の形 <select><option>選択してください</option></select></li> <li>●●部分の向き <select><option>選択してください</option></select></li> </ul> </div> <div> <label for="jouken2" onclick="optionView(this.htmlFor,'targetblock2')">ご注文者と送り先が違う場合はチェックして下さい</label> <input type="checkbox" onclick="optionView(this.id,'targetblock2')" id="jouken2"> <div id="targetblock2" style="display:none"> お名前<input><br> ご住所<input> </div> </div> </form> </body> </html> 私的には、最初隠れていて、何かすると出てくるってのはあまり好きではありません。 このケースでいうと、何が選べるのかってのもチェックをするかどうかの判断材料だと思えるから。 ただのサンプルケースなんで実際のフォームではまた違う印象を持つかもしれませんが。 あと、分かりやすいフォームを目指すなら「アクセシビリティ フォーム」 「ユーザビリティ フォーム」とかで検索すると参考になりますよ。 （フォームは結構奥が深い）
その他の回答 (1)
- arenani_sorenani
- ベストアンサー率73% (58/79)
サイトは知らないので書きました・・ こんな感じでしょうか。 <style type="text/css"> #design1{ display:none; } </style> <script type="text/javascript"> function check(){ return false; } function show_Design1(obj){ if(obj.checked){ document.getElementById("design1").style.display="block" }else{ document.getElementById("design1").style.display="none" } } </script> <body> <form name="form1" method="POST" action="" onsubmit="return check()"> <input type="checkbox" id="check1" name="check1" onclick="show_Design1(this)" /> <label for="check1">デザイン加工を希望する（希望の方はチェックをお願いします。）</label><br> <div id="design1"> ●●部分の色 <select name=""><option value="">--選択--</option></select><br> ●●部分の形 <select name=""><option value="">--選択--</option></select><br> ●●部分の向き<select name=""><option value="">--選択--</option></select> </div> <input type="submit" value="送信" /> </form> </body> .
お礼
arenani_sorenaniさん ありがとうございます。 まさしくイメージ通りって感じです（涙） 参考にさせて頂き、構築したいと思います。 本当にありがとうございました。
関連するQ&A
- ラジオボタンの選択後に詳細記入欄表示
ＣＧＩの素人が質問していますので、変な質問だったらごめんなさい…。 ※ＣＧＩで出来るのかも分かりません…。(汗) 現在グッズデザインの注文フォームを構築中なんですが、 出来る限り分かりやすい注文フォームを構築したいと考えています。 で！ 『デザイン加工を希望する』のラジオボタンをチェックした時のみ 各デザイン部分のリストボックスが表示されるようにしたいのですが 例） ○ デザイン加工を希望する（希望の方はチェックをお願いします。） ラジオボタンをチェックすれば、以下の項目が表示される ●●部分の色『リストボックス』 ●●部分の形『リストボックス』 ●●部分の向き『リストボックス』 という感じです。 もう少し分かりやすい感じですと、 注文フォームで 『○ ご注文者と送り先が違う場合はチェックして下さい』 で、チェックすると名前、住所、電話など入力できるフォームが表示される 見ないな感じです。 この様な内容を解説しているページをご存知でしょうか？ ここが良いよ！的なWebサイトがありましたら教えてください。 宜しくお願い致します。 PS.ソフトはホームページビルダーVer６を使用しています。
- ベストアンサー
- Perl
- オプションボタンでリストボックスの表示を切り替え
VBAの初心者です。 知恵をお貸しください。 ユーザーフォーム内にオプションボタンを2つ、リストボックスが1つ配置してあります。オプションボタン1でデータ1がリストボックス内に表示。オプションボタン2でデータ2がリストボックスに表示されてます。この時、2つのデータが同時に表示されてしまいます。オプションボタン1の時は1のデータ、オプションボタン2の時は2のデータだけを表示させるにはコードをどのように書けばいいかご教授ください。宜しくお願い致します。
- 締切済み
- Excel（エクセル）
- 【Excel】ラジオボタンやチェックボックスの使い方
こんにちは Excelのフォームを使って、セルにラジオボタンやチェックボックス、 ボタンなどを配置することができますが、形だけが配置されて、機能させることができません。 これらの使い方を教えてください。 ラジオボタンで選んだセルの内容を、別のセルに表示するといったことがやってみたいのですが、これでできますか。
- ベストアンサー
- オフィス系ソフト
- ラジオボタンは0からと1からのどちらがスマートですか？
フォームのチェックBOXのvalueは、0と1が一般的だと思いますが、ラジオボタンのvalueで一般的なのは、 0から始めるのと1から始めるのはどちらが良いのでしょうか？
- 締切済み
- JavaScript
- リストボックス項目の変更
javascript初心者です。 ラジオボタンを2つ、複数選択リストボックスが1つあります。どちらのラジオボタンをチェックしているかで、リストボックス内の項目を変化させたいと思っています。 これはjavascriptで実現可能でしょうか？参考になるサイトや方法を教えていただければ嬉しいです。
- ベストアンサー
- JavaScript
- ラジオボタンのチェック
VB2010で作成してるんですけど。 ラジオボタンをフォームに入れてデバッグすると、ラジオボタンがチェックされて表示されてしまいます。。 Form_Loadでラジオボタンのチェックを外すコードは書いたんですけど・・。 RadioButton1.Checked = False という風に。 でもやはりチェックがついています。。 どうしたらチェックを外した状態で表示できるでしょうか？
- ベストアンサー
- Visual Basic
- エクセル2003 「レ」表示できるラジオボタン（オプションボタン）
WindowsXPのエクセル2003で「レ」表示できるラジオボタン（オプションボタン）が欲しいのですが、どのように作ればよいでしょうか？（VBAとか） もしくは、もともとエクセルにあるチェックボックスをラジオボタンのように、どちらか一方しか選べないようにできる方法はあるのでしょうか？ よろしくお願い致します。
- 締切済み
- オフィス系ソフト
- フォーム内でのリストボックスなどの下三角とそのバックの色。
昨晩 http://oshiete1.goo.ne.jp/kotaeru.php3?q=351693 という質問をし、テキストボックスや、送信ボタンなどは変更できました。 さらに、リストボックスなどの右の下三角やそのまわり（グレー部分）の 変更と、ラジオボタンも変更できたら・・・と欲張ってきました。 ラジオボタンはできなくてもいいのですが、リストボックスはぜひ変えたいの です。 何か方法はありますか？
- 締切済み
- HTML
- 初心者です。メールフォームを作りたいのですが・・
ＣＧＩ初心者です。 ネットグルーヴでサーバーをレンタルしていて、 メールフォームを作りたいのですがうまくいきません。 http://www.netgroove.ne.jp/index.html メールフォームの内容は 商品の申込フォームの様な感じで 氏名、・・・・１行テキスト フリガナ、・・・・１行テキスト 郵便番号、・・・・１行テキスト 住所、・・・・１行テキスト 電話番号、・・・・１行テキスト メールアドレス、・・・・１行テキスト 性別、・・・・ラジオボタン 年齢、・・・・１行テキスト ご希望の商品番号、・・・・オプションメニュー（商品番号１～３の中から選ぶ） 配送日付指定、・・・・リストボックス メルマガ配信希望、・・・・ラジオボタン ・・・というような感じで作りたいのです。 デザインは特にこだわらないので簡単でいいのですが、 メールが届かなくて困っています。 期日も迫っている為、 詳しく教えていただけないでしょうか。 よろしくお願いします。
- 締切済み
- CGI
- ラジオボタンでのメールアドレスの必須チェックをするには…？
こんにちは。いつもお世話になります。 JavaScriptの事で、色々検索して回ったのですが、ピッタリのものが無く。。(>_<)ヽ もしどなたかわかる方がいらっしゃいましたら、お願い致します。 ○不要 ○希望 メールアドレス：「(テキストボックス)」 例えばこのような内容のフォームで、「不要」のラジオボタンがチェックされていた場合は、 メールアドレスは入力せずに送信が出来、「希望」のラジオボタンがチェックされていた場合は、 メールアドレスが入力されていない場合は「メールアドレスを入力して下さい」といった アラートを出すようなJavaScriptは、どのようにすれば宜しいでしょうか。。 どうぞよろしくお願いいたします。(_ _*)
- ベストアンサー
- JavaScript
お礼
お～～！ これこれーー～って感じです（涙） ありがとうございます。 「アクセシビリティ フォーム」「ユーザビリティ フォーム」という 言葉を知りませんでした…。 「javascript 表示 非表示」も含めて検索して勉強します。 ありがとうございました。m(_ _)m