- 締切済み
セレクトボックスを動的に選択された状態で表示
画面から取得した値を元にセレクトボックスが選択された状態で画面に表示させる方法を教えて下さい。 JavaScript //前の画面から値を取得 //取得した値は問題無し if(kbumon=="10"){ var bumon = "部署1"; }else if(kbumon=="20"){ var bumon = "部署2"; }else{ var bumon = ""; } var data = { bumon : bumon, } html <span style=" color:black;"><b>部署：</b></span> <select name="bumon" class="select"> <option></option> <option>部署1</option> <option>部署2</option> </select>
- osaka5963
- お礼率50% (8/16)
- SQL Server
- 回答数1
- ありがとう数0
- みんなの回答 （1）
- 専門家の回答
みんなの回答
- AsarKingChang
- ベストアンサー率46% (3467/7472)
https://techacademy.jp/magazine/22795 おそらくこれのことかな。。 var select = document.getElementById("sample"); select.options[1].selected = true; この部分 なので、 部署１は先頭から２番目の０オリジンで[1] 部署２は先頭から３番目の０オリジンで[2] を実行すればよいかと。 どうでしょうか？
関連するQ&A
- セレクトボックスの選択状態について
セレクトボックスの横にチェックボックスがあり、 チェックボックスON→セレクトボックスはAの内容 チェックボックスOFF→セレクトボックスはBの内容 となるものがあります。 問題は、これに値を保持する機能を付けたいのです。 例えば、チェックボックスにチェックがある状態でセレクトボックスの３番目の要素を選択していたとします。そこで、チェックをはずし一度Ｂの内容を表示させてから、再度チェックを付けＡの内容に戻した時に３番目の要素が選択されている状態にしたいです。逆の場合も同様にしたいです。アドバイスを頂けたらと思います。宜しくお願い致します。 <script type="text/javascript"> <!-- a = 0; b = 0; txt = {}; txt["A"] = new Array("設定なし","A1","A2"); txt["B"] = new Array("設定なし","B1","B2","B3"); function set(select_box,check_box){ if (document.forms[0].elements[check_box].checked) { key = "A"; b = document.forms[0].elements[select_box].options.selectedIndex; } else { key = "B"; a = document.forms[0].elements[select_box].options.selectedIndex; } while (document.forms[0].elements[select_box].options[0]){ document.forms[0].elements[select_box].options[0] = null; // セレクトボックスのメニューを消去 } for (i=0; i<txt[key].length; i++){ document.forms[0].elements[select_box].options[i] = new Option(txt[key][i],txt[key][i]); // セレクトボックスのメニューの項目を生成・表示テキストとvalue値を設定 } if (key = "A") { document.forms[0].elements[select_box].options.selectedIndex = a; } else if (key = "B") { document.forms[0].elements[select_box].options.selectedIndex = b; } } // --> </script>
- ベストアンサー
- JavaScript
- セレクトボックスで選択された内容での切り替え
こんにちは。 日にちを選択するセレクトボックスAと、 時間を選択するセレクトボックスB、Cを用意します。 はじめはAとBが表示されている状態です。 Aを選択したときに、 Aのボックスの中身が土日ならば、Bを消して（display：none）Cを表示させ、 Aのボックスの中身が平日ならば、そのままBを表示させたいです。 何度も日にちを変更してもB、Cの切り替えをおこないたいんです。。 しかも同じものを3つ用意したいんです。 一つ目はなんとか動くんですが、 二つ目と三つ目がうまく動きません。 一つ目のAが平日の場合だと、二つ目と三つ目のAが土日であっても平日の表示 （この場合セレクトボックスBが表示）されてしまいます。。。 初心者です。。なにかアドバイスなどいただけませんでしょうか？？ 書き方も手探りなんで、ぐちゃぐちゃかと思います。。赤を入れて頂けると幸いです。。 現状はこんな感じです。。 select.mfpはセレクトボックスA .time0１はセレクトボックスB .time02はセレクトボックスCです。 $("select.mfp").change(function () { var str = $("select.mfp option:selected").text(); var STR =str.charAt(12); // if (STR=="土" || STR=="日"){ // $(this).parent().children(".time02").css( 'display', 'block' ) // $(this).parent().children(".time01").css( 'display', 'none' ); // }else{ // $(this).parent().children(".time01").css( 'display', 'block' ) // $(this).parent().children(".time02").css( 'display', 'none' ) // } }).change(); －－－－－－－HTML－－－－－－－－－－－－ <tr class="mfptr"> <td id="second"><!--<input type="hidden" name="ご予約日[join]年+月+日+時間+分" value="" />--> <p class="float">●第一希望 </p> <script type="text/javascript" src="./contact/commons/choice_date.js"></script> （↑これで日付のセレクトボックスを生成しています。） <select name="時間" class="mfp time01"> <option value="時間">時間</option> </select> <select name="時間" class="mfp time02"> <option value="時間2">時間2</option> </select> </td> </tr> 解りづらくてすみません。。 宜しくお願いします。
- 締切済み
- JavaScript
- リストボックスから選択できないのはどうして！？
実はJAVASCRIPTでリストボックス(select1)から会社名を選択するとその下のテキストボックス(link)に そのURLがでるものを作っていたのですが、なぜかリストボックスが選択できない状態になってしまいます。 下のがそのコードなのですが、どなたかわかるかたいらっしゃいませんか？ どうぞよろしくお願いいたします。 <SCRIPT type="text/javascript"> <!-- function aaa() { var a; if((f.select1.value) ="Ａ社") {url = "http://www.a***.co.jp" }; else if((f.select1.value) ="Ｂ社") {url =" http://www.b***.co.jp" }; else if((f.select1.value) ="Ｃ社") {url = "http://www.c***.co.jp" }; else{url = "URLはありません"}; (f.link.value) = url; return } //--> </script> <select onchange = "aaa()" name="select1"> <option value="A社" selected>A社</option> <option value="B社">B社</option> <option value="C社">C社</option> <option value="D社">D社</option> </select> <input type="text" name="link">
- ベストアンサー
- JavaScript
- ２つのセレクトボックスを連動させたい
２つのセレクトボックスを連動させて、 片方の選択を変更すると、もう一方の選択できる範囲が限定されるようにしたい。 下記のようなソースでセレクトボックスを2つ表示させています。 jQueryを使用しています。 それぞれ「開始年」「終了年」という意味合いで、 取得する値から、「年の範囲」を決定するものです。「option」の「value」には、西暦の4桁の数字が入るようにしています。 そこで、「開始年」選択を変更させたときに、「終了年」のセレクトが開始年よりも古い年を選択できないように連動させたいのですが、何かいい方法はないでしょうか。 ※「送信」ボタンをクリックした際に、警告文を表示するのではなく、 ２つのセレクトを連動される形で実現させたいと考えております。 ↓↓【記述コード】---------------------------------------------- 開始年：<select name="year_start" id="feas_1_1"></select> <script type="text/javascript" src="jquery-1.11.1.js"></script> <script type="text/javascript"> //現在の年数オブジェクトを4桁で生成 var time = new Date(); var year = time.getFullYear(); var init_year = 1955; //1970年まで表示 for (var i = init_year; i <= year; i++) { if(i < 1989){ no = 1925; era = '昭和 '; }else{ no = 1988; era = '平成 '; } var s = i - no; if(s == 1){ s = '元'; } $('#feas_1_1').append('<option value="' + i + '">' + era + s +'年( '+ i+ '年)</option>'); } </script> 終了年：<select name="year_end" id="feas_1_2"></select> <script type="text/javascript"> //現在の年数オブジェクトを4桁で生成 var time = new Date(); var year = time.getFullYear(); var init_year = 1955; //1970年まで表示 for (var i = year; i >= init_year; i--) { if(i < 1989){ no = 1925; era = '昭和 '; }else{ no = 1988; era = '平成 '; } var s = i - no; if(s == 1){ s = '元'; } $('#feas_1_2').append('<option value="' + i + '">' + era + s +'年( '+ i + '年)</option>'); } </script>
- 締切済み
- JavaScript
- 選択したラベルを別の箇所に表示するには？
お世話になります。 SELECTで選択したラベルを別の箇所に表示したいと考えており下記のように記述をしましたがどうも反応してくれません・・。 アドバイス頂けますと幸いです。 ■【HTML】 <SELECT name="search_price"> <option id="sp0" value="aaa" selected><label for="aaa">りんご</label></option> <option id="sp1" value="bbb" ><label for="bbb">みかん</label></option> <option id="sp2" value="ccc" ><label for="ccc">たぬき</label></option> </SELECT> <div id ="search_price">結果未表示</div> ■【Javascript】 $(window).load(function(){ var $b = $('select[name="search_price"]'); $b.bind('change', function(){ var add = ''; $b.each(function(index, value) {★ if ('select option:selected'){★ add += '<span>' + $('select option:selected').html() + '</span>');★ } }); if (add.length > 0) { add = add.substring(0, add.length - 2) + '.'; } else { add = '結果未表示'; } $('#search_price').html(add); }); }); 選択した項目のラベル（りんご等）が#search_priceの箇所に表示をさせてたいです。 行内の★の箇所がどうも怪しいようなのですが、アドバイスのほどよろしくお願い致します。
- ベストアンサー
- JavaScript
- selectで選択した情報を再表示させる方法を教えてください。
はじめて質問させて頂きます。 PHPでプログラムを組んでいたのですが選択した項目の情報を金額表示と一緒に表示させたいのですが初心者のためどのようにすればいいか分かりません。 解決方法を教えてください。 下記が作ったプログラムです。 <html> <head><tile>項目の選択ページ</title></head> ピザ生地を選択してください。<br> <form action="piza.php" method="post"> <select name="kizi"> <option value="1">パン生地</option> </select></p> </select></p> <p>トッピングを選んでください。<br> <select name="top"> <option value="1">サラミ</option> </select></p> <p>ソース選んでください。<br> <select name="sou"> <option value="1">イタリアン</option> <option value="2">カレー</option> </select></p> <p>個数を入力してください。<br> <select name="ko"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> </select> <select name="ko2"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> </select> <select name="ko3"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> </select> 個<br><br> <input type="submit" name="submit" value="合計金額"><br><br> <p><font><合計金額></font><br> <?php $kizi=$_POST['kizi']; $sou=$_POST['sou']; $top=$_POST['top']; $ko=$_POST['ko']; $ko2=$_POST['ko2']; $ko3=$_POST['ko3']; $Gn = 0; $n10 = intval ("$ko"); $m10 = intval ("$ko2"); $l10 = intval ("$ko3"); $ga = ($n10 * 100 + $m10 * 10 + $l10); $Gn = ($An + $Bn + $Cn); //An,Bn,Cnは金額1枚当たりの金額 //$A,B,Cは個数によって割引される上限 //Gnは個数×金額 //gaは選択された個数 if ($kizi=="1" && $sou=="1" && $top=="1" ){ $An = 260; $Bn = 263; $Cn = 221; $Dn = 0; $A = 10; $B = 20; $C = 30; if($ga <= $A){ $An ; }else if($ga > $A && $ga <= $B){ $Bn ; }else if($ga > $B && $ga <= $C){ $Cn ; }else{ $Dn ; print "当店ではそれ以上作れません"; } }elseif ($kizi=="1" && $sou=="2" && $top=="1" ){ $An = 323; $Bn = 240; $Cn = 204; $Dn = 0; $A = 10; $B = 20; $C = 30; if($ga <= $A){ $An ; }else if($ga > $A && $ga <= $B){ $Bn ; }else if($ga > $B && $ga <= $C){ $Cn ; }else{ $Dn ; print "当店ではそれ以上作れません"; } } if(!isset($_POST['kizi'])){ print ""; $Gn = 0; } $Gn = 0; if($n10==0 && $m10==0 && $l10==0){ $Gn = $An * 0 + $Bn * 0 + $Cn * 0; }else if($ga <=$A){ $Gn = ($ga * $An) * 10; }else if($ga > $A && $ga <= $B){ $Gn = ($A * $An + ($ga - $A) *$Bn )* 10; }else if($ga > $B && $ga <= $C){ $Gn = ($A * $An + ($B - $A) * $Bn + ($ga - $B) * $Cn) * 10; }else{ $Gn = ($Dn); } ?> <input type="text" name="kingaku" size="20" value="<?=$Gn?>">円<BR><BR><HR> </Form> <a href="default.htm">戻る</a><BR><BR> <a href="../../default.htm">トップページ</a><BR><BR> </body> </html>
- ベストアンサー
- PHP
- セレクトボックス の 選択規制
今、フォームで入力画面を作っています。 その中にセレクトボックスが４つアリ、現在「未選択」の場合エラーチェックをするようにしています。 そして、ここにもうひとつのチェックを追加したいのですが皆目見当が付きません・・・ 条件 kaikai、bunkai1、bunkai2、heikai 全てが不参加の場合 "参加する会を最低一つは選択してください。"と言うコメントをだすというものです。 皆様よろしくお願いいたします。 ******** 現在の JavaScript ********* <SCRIPT language="JavaScript"> <!-- //フォームチェック function fcheck() { if(document.form1.kaikai.value == "未選択") { window.alert("選択してください"); return false; } if(document.form1.bunkai1.value == "未選択") { window.alert("選択してください"); return false; } if(document.form1.bunkai2.value == "未選択") { window.alert("選択してください"); return false; } if(document.form1.heikai.value == "未選択") { window.alert("選択してください"); return false; } } //--> </SCRIPT> ******** HTML内のフォーム ********* <table> <tr><th>1 ( * )</th> <td> <SELECT NAME="kaikai"> <OPTION selected VALUE="未選択">選択してください</OPTION> <OPTION VALUE="参加">参加</OPTION> <OPTION VALUE="不参加">不参加</OPTION> </SELECT></td></tr> <tr><th>2 ( * )</th> <td> <SELECT NAME="bunkai1"> <OPTION selected VALUE="未選択">選択してください</OPTION> <OPTION VALUE="参加">参加</OPTION> <OPTION VALUE="不参加">不参加</OPTION> </SELECT></td></tr> <tr><th>3 ( * )</th> <td> <SELECT NAME="bunkai2"> <OPTION selected VALUE="未選択">選択してください</OPTION> <OPTION VALUE="参加">参加</OPTION> <OPTION VALUE="不参加">不参加</OPTION> </SELECT></td></tr> <tr><th>4 ( * )</th> <td> <SELECT NAME="heikai"> <OPTION selected VALUE="未選択">選択してください</OPTION> <OPTION VALUE="参加">参加</OPTION> <OPTION VALUE="不参加">不参加</OPTION> </SELECT></td></tr> </table>
- ベストアンサー
- JavaScript
- 2つのセレクトボックスで選択した組み合わせの結果
社内で個人的に使うためのツールを Google Sites で作成中なのですが、 できれば、セレクトボックスの組み合わせの結果はテキストではなく、 条件に一致した結果でのフローをまとめた画像やGoogleスライドを指定して、 各条件ごとに振り分けて表示させたいと考えています。 ネットで色々と検索しながら試行錯誤した結果、 <textarea> に画像やスライドを反映するのは不可と判断しておりますが、 なにか別の要素を指定することで可能な場合や、 その他に可能な方法があればご教示いただけますと幸いです！ コードは下記です。 </head> <!-- javascriptファイル --> <script type="text/javascript"> function check(f){ var arr={ "A":{"aaa":"Aとaaaを選択しました","bbb":"Aとbbbを選択しました"} ,"B":{"aaa":"Bとaaaを選択しました","bbb":"Bとbbbを選択しました"} }; var select1=f.elements["select1"].value; var select2=f.elements["select2"].value; f.elements["C"].value=(arr[select1] && arr[select1][select2])?arr[select1][select2]:""; } </script> <!-- jQuery --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> <body> <p class="title">該当する組み合わせを選択してください。</p> <form> <div class="cp_ipselect cp_sl01"> <select name="select1" onchange="check(this.form);"> <option value="">------ 選択肢①を選択してください ------</option> <option value="A">A</option> <option value="B">B</option> </select> </div> <div class="cp_ipselect2 cp_sl02"> <select name="select2" onchange="check(this.form);"> <option value="">------ 選択肢②を選択してください ------</option> <option value="aaa">aaa</option> <option value="bbb">bbb</option> </select> </div> <p class="title2">選択肢①と②の組み合わせの結果</p> <!-- 下の textarea 箇所に各組み合わせごとにテキストではなく、画像やスライドを表示したいです --> <textarea name="C"></textarea> </form> </div> </body> </html>
- ベストアンサー
- JavaScript
- javascriptでセレクトボックスを動的に
javascriptでセレクトボックスの"selected"を動的に変更する方法を教えてください＞＜ 下記のselectedを"１０"から"５０"に変更したいのですが、 某ASPサービスの環境下での作業のため制約があり直接変更できません。 <body onload="event"> <select name="select"> <option value="10" selected="selected">10件</option> <option value="30">30件</option> <option value="50">50件</option> </select> そこで、JavaScriptで何とかしようと思うのですが、 <select>～ </select>の間（selectタグ含む）は、ASPサービスの制約でIDやclassを入れることもできず、 変更できるのは、body開始タグ部分、headerタグ内、body内（一部）です。 ページを読み込んだ際に、「５０件を選択」、「１０件からselected外す」状態にしたいです。 いろいろサイトを見てなんとなくできそうな気はするのですが、 スキル的に初心者レベルのため、わかりませんでした。 何卒よろしくお願いします！
- ベストアンサー
- JavaScript
- セレクトボックスの初期選択をクッキーで固定したい。
お世話になります。 php とmysql 初心者です。 php でmysqlから以下のようなセレクトボックスを作りました。 このセレクトボックスの初期値を（selected）を 見る人によって$cookie値によって固定したいのですが いろいろググったりしたのですが、 見当もつかず理屈から全くわかりません。 phpだけでできるのでしょうか？ javascript等必要でしたら できれば具体的に教えて頂ければ大変助かります。 どうかご教授の程よろしくお願い致します。 <? $sql = "SELECT * FROM table ORDER BY index ASC"; $res = mysql_query( $sql ); $options=""; while($row = mysql_fetch_array($res,MYSQL_ASSOC)){ if($cookie==$row['index']){ $options.="<option value='{$row['index']}'selected>{$row['name']}</option>\n";} else { $options.="<option value='{$row['index']}'>{$row['name']}</option>\n";} } $select="<select name='name'><option value=''>選択</option>\n{$options}</select>\n"; print $select; ?>
- 締切済み
- PHP
