- ベストアンサー
セレクトボックスの連動処理について
- JavaScript勉強中の方が、日付の入るセレクトボックスを２つ用意し、片方のセレクトボックスの日付を選択すると、もう片方のセレクトボックスに●日後の日付選択肢が表示される連動処理について質問です。
- 質問者はJavaScriptを勉強中で、動的なセレクトボックスの連動処理について不安があります。日付を選択すると、指定した日数後の日付が表示されるような連動処理について教えてください。
- JavaScriptを勉強中の方が、日付の選択肢が動的に連動するセレクトボックスを作成したいと思っています。具体的には、片方のセレクトボックスで日付を選択すると、もう片方のセレクトボックスには指定した日数後の日付が表示されるようにしたいです。どのように実装すればよいでしょうか？
- yuko8320
- お礼率24% (8/33)
- JavaScript
- 回答数2
- ありがとう数1
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
その他の回答 (1)
- fujillin
- ベストアンサー率61% (1594/2576)
「3日後」というのが固定値であるならば、2番目の値がセレクトボックスになっている意味が不明ですが… （ユーザが変更可能なので） とりあえず、2個のセレクトボックスの値が3日差で最初にセットされているという仮定のもとで、1番目の値を変更すれば2番目のものも同じインデックス番号にセットするサンプルです。 （HTML（script）サンプルです。 2番目を変更しても何もしません。） <html> <head></head> <body> Day : <select name="day" style="margin-right: 50px" onchange= "document.getElementById('day2').options[this.options.selectedIndex].selected=true;"> <option value="default">▲日付を選んで下さい</option> <option value="2009/8/24">2009/8/24</option> <option value="2009/8/25">2009/8/25</option> <option value="2009/8/26">2009/8/26</option> <option value="2009/8/27">2009/8/27</option> </select> <br>Day2: <select name="day2" id="day2" style="margin-right: 50px"> <option value="default">▲日付を選んで下さい</option> <option value="2009/8/27">2009/8/27</option> <option value="2009/8/28">2009/8/28</option> <option value="2009/8/29">2009/8/29</option> <option value="2009/8/30">2009/8/30</option> </select> </body> </html>
補足
早速にサンプルいただきまして、ありがとうございます！！ > 「3日後」というのが固定値であるならば、2番目の値がセレクトボックスになっている意味が不明ですが… （ユーザが変更可能なので） 失礼いたしました。質問の意図が誤っていました。 正しくは「3日後」ではなく「3日後以降」でした。 「3日後」が自動的に選択されるのではなく、「3日後以降」から 向こう2週間の日付が選択肢として表示されるようにしたいのです。 例えば、8/25を選ぶと8/28～9/10。 8/26を選ぶと8/29～9/11。といった具合です。 日本語がおかしくてお手数おかけいたしましたが、 宜しくお願いいたします。
関連するQ&A
- セレクトボックスの連動処理について
PHPに投稿すべき内容かもしれませんが、 こちらに投稿します。以下URLを参考にセレクトボックスの 連動処理を実行させています。 やりたい事は以下になります。 ・PHPにてフォーム(親-子のセレクトボックス)を記載し、 親-子を連動させる仕組を複数作成する為です。 http://www.skuare.net/test/jdependent.html こちらのページに記載されている内容で、一つの関連付けされている セレクトボックス(親-子-孫)については、連動処理する事が確認できましたが、 例えば以下のように関連付けされているセレクトボックスが2つある時に 2個目のセレクトボックスの選択や表示がされません。 <TABLE> <select name="id" id="id" class="selectable"> <option value="">-- select --</option> <option value="1" title="flowers" >Flowers</option> <option value="2" title="animals" >Animals</option> </select> <select name="id2" id="id2" class="selectable"> <option value="">-- select --</option> <option value="1" class="flowers" title="sunflower" >Sunflower</option> <option value="2" class="flowers" title="rose" >Rose</option> <option value="3" class="animals" title="dog" >Dog</option> <option value="4" class="animals" title="cat" >Cat</option> </select> </TABLE> <TABLE> <select name="id" id="id" class="selectable"> <option value="">-- select --</option> <option value="1" title="flowers" >Flowers</option> <option value="2" title="animals" >Animals</option> </select> <select name="id2" id="id2" class="selectable"> <option value="">-- select --</option> <option value="1" class="flowers" title="sunflower" >Sunflower</option> <option value="2" class="flowers" title="rose" >Rose</option> <option value="3" class="animals" title="dog" >Dog</option> <option value="4" class="animals" title="cat" >Cat</option> </select> </TABLE> おそらくスクリプト記載部分の $(document).ready(function(){ $('#id2').dependent({ parent:'id',//親のid名 group: 'selectable' }); }); #id2辺りを触る必要があるのだとは思うのですが、 同じ内容のセレクトボックスをPHPに複数記載した時に、 どのようにスクリプトを変更する必要があるかが解らず 非常に困っております。どなたか教えていただければ 幸いです。 ※JavaScriptはまだ触り始めの為、初心者です。
- ベストアンサー
- JavaScript
- 連動させたいセレクトボックスについて。
こんにちは。DB＋PHPが初心者のものです。 前にもここで質問させていただきましたが、 自分なりにコードを書いてみたので コードの訂正、ご教授をよろしくお願いいたします。 セレクトボックス1には、[table 1]の、種類が入り れレクトボックス2には、[table 1]の種類に連動して、[table 2]の名前が選択できるようにする。 下記のようにソースを書いてみましたが、 table１の値は、セレクトボックスでちゃんと表示されますが、table2はセレクトボックスは表示されるものの、何も値がありません(T_T) 動きとしては、table1のセレクトボックスで選択したら、その項目をDBへ問い合わせ、その項目に対応した、DBに登録されているtable2の値を二つ目のセレクトボックスに表示させたいです。 <html> <body> <select name="mkoumoku"> <option selected>-------------</option> <?php //DB接続 $dbcon=mysql_connect("localhost","abcd","defg"); //DB選択 mysql_select_db("zozozo"); //table1を取得 $res=mysql_query("select distinct * from table1"); while ($rows=mysql_fetch_array($res)) { echo "<option value=\"".$rows['id']."\">".$rows['kind']."\n"; } echo "</select>"; ?> <select name="skoumoku"> <option selected>-------------</option> <? //table1に連動して項目を変えたいところのコード $res1=mysql_query("select * from table2 where key =$_POST[mkoumoku] order by id"); while ($rows=mysql_fetch_array($res1)) { echo "<option value=\"".$rows['id']."\">".$rows['name']."\n"; } //Dbクローズ mysql_close($dbcon); ?> </body> </html>
- ベストアンサー
- PHP
- セレクトボックスの連動
セレクトボックスＡを切り替えると、他のセレクトボックスがＡと同じになるようなものを作りたいのですが、うまくいきません。 ソースは以下の通りです。 function ChangeSelect() { var index = formA.selectA.selectedIndex; for (i=1,i<formB.selectCnt.value,i++) { if (i == index) { FormB.selectB1.options[index].value ); } } } <form name="formA"> <select name="selectA" onchange="javascript:ChangeSelect()"> <option value="りんご">りんご <option value="みかん">みかん <option value="いちご">いちご </select> </form> <form name="formB> <input type="hidden" name="selectCnt" value=***> <select name="selectB1"> <option value="りんご">りんご <option value="みかん">みかん <option value="いちご">いちご </select> </form> 存在するセレクトボックスは全て同じ値が入っています。 formAにはセレクトボックスは1つですが、formBにあるセレクトボックスは0～複数と場合によって異なります。 formBにあるセレクトボックスはselectB1、selectB2、selectB3という感じに最後の数字のみが異なるnameがつくようにしています。 <input type="hidden" name="selectCnt" value=***>のvalueには、ASPで数えたセレクトボックスの数を入れています(セレクトボックスが10個あれば10と入ります) 数が決まっていればFormB.selectB1.options[index].valueを数の分だけ増やせばいいのですが、0の時もあれば10の時もある、という場合にはどういう風に書けばいいのかわかりません。 どのように記述すれば良いのでしょうか。アドバイスお願いします＞＜
- ベストアンサー
- JavaScript
- プルダウンからの日付取得処理
現在、PHP＋SQLiteでWEBページを作成しております。 （初心者です。） フォームに日付をプルダウンで選択出来るように、 $utime = time()+$jisa*3600; $today = getdate($utime); //年のセレクトボックス（±2年） echo "<select name=year>\n"; for ($y=$today[year]+2; $y>=$today[year]-2; $y--) { $sel = ($y == $today[year]) ? " selected" : ""; echo "<option value=\"$y\"$sel>$y</option>\n"; } echo "</select>/\n"; //月のセレクトボックス(12-1月） echo "<select name=mon>\n"; for ($m=12; $m>=1; $m--) { $sel = ($m == $today[mon]) ? " selected" : ""; echo "<option value=\"$m\"$sel>$m</option>\n"; } echo "</select>/\n"; //日のセレクトボックス(31-1日) echo "<select name=day>\n"; for ($d=31; $d>=1; $d--) { $sel = ($d == $today[mday]) ? " selected" : ""; echo "<option value=\"$d\"$sel>$d</option>\n"; } echo "</select>\n"; というコードを記述しております（これはネットを参考にしました）。 これでプルダウンの表示自体は出来たのですが、実際にここから値を取得するにはどうすれば良いかが分かりません・・・。 ご教授お願いいたします。
- ベストアンサー
- PHP
- phpのセレクトボックスの配列について
お世話になっています。 PHPのセレクトボックスの設定でわからないことがあります。 一度質問させていただいたのですが連なる点でわからないとこが出たので質問させていただきます。 不明点は３つあります。 １．セレクトボックスの値を配列で設定する 配列で設定しておけばその配列を複数使用しても参照配列さえメンテすればいいと思うので配列を想定しています ２．配列で設定したときのセレクトボックスの初期値について セレクトボックスの値をベタ書きしている場合は単にselectedすればいいと思うのですが配列の場合厳密なselectedの方法が不明です ３．配列での選択値をPOSTした場合 3つめが最もはまっています以下のソースだと選択値が配列の値が表示されますし、初期値も表示できていますが POSTした値がまともに渡されていません POST先でDB処理を想定しているのですがdate型だとすべて[00:00:00]になってしまいます。 配列を使用しないパターンだと１．２．３全てうまくいくのですがメンテナンスがしづらいので配列で指定したいです 何か、良い方法があればご教授ください //配列の値 $time = array( "0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23" ); $minute = array ("00", "15", "30", "45"); for( $a=0; $a < count( $time_array ); $a++){ $selectedStartTime =($time_array[$a] == $start_time[$j])?" selected":""; $startTimeSelectBox .= "\t<option value=\"{$time_array[$a]}\"{$selectedStartTime}>{$time_array[$a]}</option>\n"; } for($a=0; $a < count($minute_array); $a++){ $selectedStartMinute =($start_minute[$j] == $minute_array[$a])?" selected":""; $startMinuteSelectBox .="\<option value=\"{$minute_array[$a]} \"{$selectedStartMinute}>{$minute_array[$a]}</option>\n"; } <td><select name="start_time<?php echo $day ?>" onblur = "func()"> <?php echo $startTimeSelectBox ?> </select> : <select name="start_minute<?php echo $day ?>" onblur = "func()"> <?php echo $startMinuteSelectBox ?> </select> </td> かなり詰まっています。よろしくお願いします。
- ベストアンサー
- PHP
- phpでのセレクトボックスからの受け渡しについて
phpにおいての、セレクトボックスにより選択させたデータの受け渡しについて、どなかか教えてください。 授業評価アンケートのデータ収集システムを卒研で開発しています。 その中の一部で、 年度・学年・クラス を各々セレクトボックスにて選択させるページがあります。 仮にpage1.htmlとし、以下にその一部を示します。 <FORM method="post" action="page2.php" enctype="application/x-www-form-urlencoded"> <P> 年度： <SELECT name="nendo"> <OPTION value="1">2006</OPTION> <OPTION value="2">2007</OPTION> <OPTION value="3">2008</OPTION> <OPTION value="4">2009</OPTION> <OPTION value="5">2010</OPTION> <OPTION value="6" selected>2011</OPTION> <OPTION value="7">2012</OPTION> </SELECT> 学年： <SELECT name="gakunen"> <OPTION value="1">1年</OPTION> <OPTION value="2">2年</OPTION> <OPTION value="3">3年</OPTION> <OPTION value="4">4年</OPTION> </SELECT> クラス： <SELECT name="class"> <OPTION value="1">1組</OPTION> <OPTION value="2">2組</OPTION> <OPTION value="3">3組</OPTION> <OPTION value="4">4組</OPTION> <!-- --> </SELECT> </P> <P><INPUT type="submit" value="科目選択へ"> <INPUT type="reset" value="取り消す"></P> 次のページ(page2.php)では 科目・分類 を各々セレクトボックスにて選択させるページを用意します。 その際に、科目・分類の各々のセレクトボックスの上に、 前ページ(page1.php)にて選択された値(valueではなく文字列(2008，1年)）を表示します。 年度：～～ 学年：～～ クラス：～～ これについては以下の方法で成功しました。 年度：<? echo $_POST["nendo"]+2005?> 年 学年：<? if ($_POST["gakunen"] == "1"){ echo "1年"; } else if ($_POST["gakunen"] == "2"){ echo "2年"; } else if ($_POST["gakunen"] == "3"){ echo "3年"; } else if ($_POST["gakunen"] == "4"){ echo "4年"; } ?> クラスについても同様の手法。 ここからが本題です。 page1.html→page2.php に受け渡した年度・学年・クラスのデータを page2.php→page3.php にも同じように、年度：～～・・・と表示させたいのですが、わかりません。 hiddenというのを使うのでしょうか。 調べても、このパターンのように1ページまたいでのデータの受け渡し方法がよくわかりません。 他の方法もあるのでしょうか。 どなたか具体的に教えてください！
- 締切済み
- PHP
- 複数のセレクトボックスを1つにまとめて受け渡すには
現在"年"と"月"のセレクトボックスがあり下記のように受け渡されています <form action="./search.php" method="GET"> <select name="year"> <option value="2010">2010年</option> <option value="2011">2011年</option> </select> <select name="month"> <option value="1">1月</option> <option value="2">2月</option> <option value="3">3月</option> ・ <option value="12">12月</option> </select> <input type="submit" value="検索"> </form> 受け取り側 http://www.###.jp/search.php?year=2011&month=11 となっています。 これを dateに一まとめにして受け取りたいですが http://www.###.jp/search.php?date=201111（2011-11でも可） 選択するプログラム側の修正方法を教えて欲しいのですが。 宜しくお願い致します。
- ベストアンサー
- PHP
- 日付のセレクトボックスで0付きの日付にしたい
ネットで探した式を張り付ける位しかできない超初心者です。 以下のような当日表示の日付のセレクトボックス を探してペーストしたのですが1や2を01、02と表示しません。 これをどうやって直せば01,02,03,04,05と0付きの表示のセレクトボックスに 直せるでしょうか？ どうぞよろしくお願いいたします。 <? $time = time(); $year = date("Y", $time); $month = date("n", $time); $day = date("j", $time); print("<select name=\"ayear\">"); //年は修正してください for( $i = 2010; $i <= 2020; $i++ ){ if( $i == $year ){ print("<option value=\"$i\" selected>$i</option>"); }else{ print("<option value=\"$i\">$i</option>"); } } print("</select>年"); print("<select name=\"amonth\">"); for( $j = 1; $j <= 12; $j++ ){ if( $j == $month ){ print("<option value=\"$j\" selected>$j</option>"); }else{ print("<option value=\"$j\">$j</option>"); } } print("</select>月"); print("<select name=\"aday\">"); for( $k = 1; $k <=31 ; $k++ ){ if( $k == $day ){ print("<option value=\"$k\" selected>$k</option>"); }else{ print("<option value=\"$k\">$k</option>"); } } print("</select>日"); ?>
- ベストアンサー
- PHP
- セレクトボックスの選択を保持したい。入力フォーム。
セレクトボックスの選択を保持したい。入力フォーム。PHP 送付画像のような、セレクトボックスの「時間指定１」で選択したい時間をセレクトボックスから選んで、確認画面へのボタンをクリックすると、「時間指定１」にまた、戻ってしまいます。ここのセレクトボックスの選択をキープしたいのですが、どうコードを書けば良いのかわかりません 提示したコードにもあるように 参考書に書いてあったのですが、セレクトボックスの選択をキープするプログラミングコードを以下のようにすれば良いと。そのまま書いてみたのですが、確認画面へのボタンをクリックすると、やはり「時間指定１」に戻ってしまいます。 <option value="10:00～11:00"><?php if(isset($timehh1) && $timehh1==="10:00～11:00") { echo "selected" ;} ?>>10:00～11:00</option> どこが間違っているのでしょうか？ コードを教えて頂けないでしょうかいただけないでしょうか？よろしくお願いいたします。困っています。 以下書いたコードになります。 <?php session_start(); $errors = array(); if(isset($_POST['submit'])) { $time4 =$_POST['time4']; $timehh1 =$_POST['timehh1']; if($time4 === "") { $errors['time4'] ="第1希望：※月と日付を選択してください。 "; } if($timehh1 === "") { $errors['timehh1'] ="第1希望：※時間指定1を選択してください。 "; } if(count($errors) === 0) { $_SESSION['time4'] = $time4; $_SESSION['timehh1'] = $timehh1; } if(isset($_GET['action']) && $_GET['action'] === 'edit'){ $time4 = $_SESSION['time4']; $timehh1 = $_SESSION['timehh1']; } ?> <!DOCTYPE html> <html> <head> <meta content="text/html; charset=utf-8"/> <?php echo "<ul>";foreach($errors as $value) { echo "<li>"; echo $value; echo "</li>"; } echo "</ul>"; ?> </head> <body> <form action ="form1.php" method ="post"> <td class="b">第1希望：<span class="fontS">※</span></td> <input type="date" id="input_date1" class="cal lt_004 hasDatepicker" name="time4" value="<?php if(isset($time4)){ echo $time4; } ?>"/></td > <select id="input_time1" name="timehh1"> <option value="">時間指定1</option> <option value="10:00～11:00"><?php if(isset($timehh1) && $timehh1==="10:00～11:00") { echo "selected" ;} ?>>10:00～11:00</option> <option value="11:00～12:00"><?php if(isset($timehh1) && $timehh1==="11:00～12:00") { echo "selected" ;} ?>>11:00～12:00</option> </select > <input type ="submit" name ="submit"value="確認画面へ"/> </form> </body></html>
- ベストアンサー
- PHP
- セレクトボックスとテキストボックスの連動について
セレクトボックスで質問事項を選ぶと、テキストボックスの中に選択した名称が表示される。ということをやりたく下記の様に設定しました。 <script> function hoge(obj){ var f=obj.form; var v=obj.options[obj.selectedIndex].value; var c=f.elements["comment"]; c.value+=v; obj.selectedIndex=0; } </script> <select name="質問事項1" onchange="hoge(this)"> <option value="selected">質問事項を選んでください</option> <option value=“質問1">質問1</option> <option value="質問2">質問2</option> <option value="質問3">質問3</option> </select> <textarea name="comment"></textarea> 現在発生している問題が1点あります。 セレクトボックスで質問を2回選ぶと、選んだ2つの結果がテキストボックス内に連続して表示されます。 例： 1回目 セレクトボックス内 「質問1」を選択 ↓ テキストボックス内 「質問1」が表示 2回目 セレクトボックス内 「質問2」を選択 ↓ テキストボックス内 「質問1質問2」と表示 2回目以降選んだ場合に前回の処理をクリアにして、1つのみ表示させたいと思うのですがどうやればいいのでしょうか。 よろしくお願いします。
- ベストアンサー
- JavaScript
お礼
ありがとうございます！ ソースをわざわざいただけて感激です！！ JSだとこういう風になるんですね。 ちょっとわからない部分もありますが大分要領が掴めました！ ありがとうございました！