• 締切済み

セレクトボックスの連動処理について

お世話になります。 先日もココで質問させていただいたのですが、 JS初心者の癖に知人に頼まれJSでの処理に手を出し困っています。。。 以下のソースの様なフォームを作成しておりまして、（質問用にCSSを抜いた簡易なソースにしました。） 以下のようにやりたいことが定まっているのですが、 これをJSで書くにはどうして良いのやら。。。わからないのです・・・。 まだまだJSではしたいことを実現するだけの力がなく、 どなたかヒントだけでもいただけないでしょうか・・・？ あわよくば、サンプルコードなんていただけると、なお助かります。。 投稿文章が長くなってしまったため、 ２回に分けて投稿します。 それでは、よろしくお願い致します。 ---- やりたいこと ------------------------------------------------ hope_collect_dayの値が今日の日付と同じで、AM11:00以前であれば hope_collect_timeの選択肢として、 13～15時 15～17時 17～21時 を表示。 hope_collect_dayの値が今日の日付と同じで、PM13:00以前であれば hope_collect_timeの選択肢として、 15～17時 17～21時 を表示。 hope_collect_dayの値が今日の日付と同じで、PM15:00以前であれば hope_collect_timeの選択肢として、 17～21時 を表示。 hope_collect_dayの値が今日の日付と同じでなかったら、 hope_collect_timeの選択肢として、 　～13時 13～15時 15～17時 17～21時 を表示。 ------------------------------------------------------------------

みんなの回答

回答No.3

さらにみじかく <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <title>test</title> <body> <form name ="frm1" method="post" action="aaa.php" accept-charset="UTF-8"> <fieldset> <legend>ご希望日時</legend> <select name="hope_collect_day" onchange="init(this.value)"> <option value="" selcted="selected">日付を選んで下さい</option> <option value="0">本日</option> <option value="1">１日後</option> <option value="2">２日後</option> </select> <select name="hope_collect_time"> <option value="" selcted="selected">時間帯を選んで下さい</option> <option value="1">～13時</option> <option value="2">13時～15時</option> <option value="3">15時～17時</option> <option value="4">17時～19時</option> </select> </fieldset> <fieldset> <legend>お渡しご希望日時</legend> <select name="hope_pass_day"> <option value="" selcted="selected">日付を選んで下さい</option> <option value="3">３日後</option> <option value="4">４日後</option> <option value="5">５日後</option> </select> <select name="hope_pass_time"> <option value="" selcted="selected">時間帯を選んで下さい</option> <option value="1">9時～12時</option> <option value="2">12時～14時</option> <option value="3">14時～16時</option> <option value="4">16時～18時</option> <option value="5">18時～20時</option> <option value="6">20時～21時</option> </select> </fieldset> </form> <script type="text/javascript"> function init(v) { var o={}, i=0, n=new Date, h=n.getHours(); v-=0; if(!v){ while (o[i] = n.hizuke(i), ++i < 14); setSelect('hope_collect_day', o)} o = {}, i = 3; while (o[i] = n.hizuke(i + v), ++i < 17); setSelect('hope_pass_day', o); o = {'':'時間帯を選んで下さい', 1:'～13時', 2:'13時～15時', 3:'15時～17時', 4:'17時～19時'}; setSelect('hope_collect_time', o, 0, 0, !v * ( (h<11) * 2 + (h<13) +(h<15))); } Date.prototype.hizuke = function(n){ var c=new Date(this); n&&c.setHours(n*24); return c.getFullYear()+'/'+z(c.getMonth()+1)+'/'+z(c.getDate()); function z(s){return s<10?'0'+s:s} } function setSelect(n,objs,def,sel,op) { var e = document.getElementsByName(n)[0] || document.getElementById(n), i, o = e.options, c = op || 0; o.length = 0; for (i in objs) --c<0 && (o[o.length] = new Option(objs[i], i, def == i, sel == i)); } init(0); </script>

回答No.2

う～～ん。まな～が・・・。 phpをつかうりゆうが、わからないので、すくりぷとだけで、かいたじょ！ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <title>test</title> <body> <form name ="frm1" method="post" action="aaa.php" accept-charset="UTF-8"> <fieldset> <legend>ご希望日時</legend> <select name="hope_collect_day" onchange="init1(this)"> <option value="" selcted="selected">日付を選んで下さい</option> <option value="0">本日</option> <option value="1">１日後</option> <option value="2">２日後</option> </select> <select name="hope_collect_time"> <option value="" selcted="selected">時間帯を選んで下さい</option> <option value="1">～13時</option> <option value="2">13時～15時</option> <option value="3">15時～17時</option> <option value="4">17時～19時</option> </select> </fieldset> <fieldset> <legend>お渡しご希望日時</legend> <select name="hope_pass_day"> <option value="" selcted="selected">日付を選んで下さい</option> <option value="3">３日後</option> <option value="4">４日後</option> <option value="5">５日後</option> </select> <select name="hope_pass_time"> <option value="" selcted="selected">時間帯を選んで下さい</option> <option value="1">9時～12時</option> <option value="2">12時～14時</option> <option value="3">14時～16時</option> <option value="4">16時～18時</option> <option value="5">18時～20時</option> <option value="6">20時～21時</option> </select> </fieldset> </form> <script type="text/javascript"> function init () { 　var val = [], day = [], now = new Date, cnt; 　for (cnt = 0; cnt < 14; cnt ++) { 　　val.push(cnt); 　　day.push(now.hizuke(cnt)); 　} 　setSelect('hope_collect_day', day, val, 0, 0); 　init1(); } function init1 () { 　var val = [], day = [], now = new Date, cnt, h = now.getHours(), s = 0; 　var n = document.getElementsByName('hope_collect_day')[0].value - 0; 　for (cnt = 3; cnt < 17; cnt ++) { 　　val.push(cnt + n); 　　day.push(now.hizuke(cnt + n)); 　} 　setSelect('hope_pass_day', day, val, 1, 1); 　val = ['',1,2,3,4]; 　tim = ['時間帯を選んで下さい','～13時','13時～15時','15時～17時','17時～19時']; 　if (document.getElementsByName('hope_collect_day')[0].value == '0') { 　　if (h < 11) s = 2; else if (h<13) s = 3; else if (h<15) s = 4; 　} 　setSelect('hope_collect_time', tim, val, 1, 1, s); } Number.prototype.zero = function(n){ return ('00000000000000'+ this).slice(-n); } Date.prototype.hizuke = function(n){ 　var c = new Date(this); 　if (undefined != n) c.setHours(n * 24); 　return c.getFullYear().zero(4)+'/'+(c.getMonth()+1).zero(2)+'/'+c.getDate().zero(2); } function setSelect (n, texts, values, default_v, selected_v, op) { 　var e = document.getElementsByName(n)[0] || document.getElementById(n), i, t, v; 　 　if (e) { 　　e.options.length = 0; 　　for (i = op || 0; i < texts.length; i++) { 　　　t = texts[i]; 　　　v = values[i]; 　　　e.options[e.options.length] = new Option(t, v, default_v == v, selected_v == v); 　　} 　} } init(); </script> これとは、まったくちがうことなのだけど。 教えてgooで、みると、「このカテゴリで人気のQ&A」のいちらんに 「１つのformで複数のactionを実行できますか？」が、とっぷで くいこんでくるのはなぜ？とおもうのは、ばぶぅ～だけ？ ということを、かいとうするたびに、つけている。^^; というか、さいきん、これをかきたいがために、かいとうしている？

回答No.1

質問者のyuko8320です。 以下、質問の続きになります。 ---- ここからソース ---------------------------------------------- <?php //時間帯セット $hope_time_set = array( "0"=>"▲時間帯を選んで下さい", "1"=>"9時～13時", "2"=>"13時～15時", "3"=>"15時～17時", "4"=>"17時～19時" ); //時間帯セット $pass_time_set = array( "0"=>"▲時間帯を選んで下さい", "1"=>"9時～12時", "2"=>"12時～14時", "3"=>"14時～16時", "4"=>"16時～18時", "5"=>"18時～20時", "6"=>"20時～21時" ); //日付セット for($a = 0; $a < 14; $a++) { $timestamp[] = strtotime("+$a day"); } $collect_day_set = array( "0"=>"▲日付を選んで下さい", "1"=>date( 'Y/m/d', $timestamp[0] ) , "2"=>date( 'Y/m/d', $timestamp[1] ) , "3"=>date( 'Y/m/d', $timestamp[2] ) , "4"=>date( 'Y/m/d', $timestamp[3] ) , "5"=>date( 'Y/m/d', $timestamp[4] ) , "6"=>date( 'Y/m/d', $timestamp[5] ) , "7"=>date( 'Y/m/d', $timestamp[6] ) , "8"=>date( 'Y/m/d', $timestamp[7] ) , "9"=>date( 'Y/m/d', $timestamp[8] ) , "10"=>date( 'Y/m/d', $timestamp[9] ) , "11"=>date( 'Y/m/d', $timestamp[10] ) , "12"=>date( 'Y/m/d', $timestamp[11] ) , "13"=>date( 'Y/m/d', $timestamp[12] ) , "14"=>date( 'Y/m/d', $timestamp[13] ) ); //お渡し日付セット for($a = 3; $a < 17; $a++) { $timestamp2[] = strtotime("+$a day"); } $pass_day_set = array( "0"=>"▲日付を選んで下さい", "1"=>date( 'Y/m/d', $timestamp2[0] ) , "2"=>date( 'Y/m/d', $timestamp2[1] ) , "3"=>date( 'Y/m/d', $timestamp2[2] ) , "4"=>date( 'Y/m/d', $timestamp2[3] ) , "5"=>date( 'Y/m/d', $timestamp2[4] ) , "6"=>date( 'Y/m/d', $timestamp2[5] ) , "7"=>date( 'Y/m/d', $timestamp2[6] ) , "8"=>date( 'Y/m/d', $timestamp2[7] ) , "9"=>date( 'Y/m/d', $timestamp2[8] ) , "10"=>date( 'Y/m/d', $timestamp2[9] ) , "11"=>date( 'Y/m/d', $timestamp2[10] ) , "12"=>date( 'Y/m/d', $timestamp2[11] ) , "13"=>date( 'Y/m/d', $timestamp2[12] ) , "14"=>date( 'Y/m/d', $timestamp2[13] ) ); ?> <!-- HTMLスタート --> <html> <head> <meta http-equiv="content-type" content="text/html;charset=UTF-8" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <script type="text/javascript" language="JavaScript" src="js/jquery.js"></script> <!-- 集荷希望日とお届け希望日のJS連動処理 --> <script type="text/javascript"> window.onload = function(){ set(); } function set() { var elm = document.forms['frm1'].elements['hope_collect_day']; var e = document.forms['frm1'].elements['hope_pass_day']; var i = 0, d, txt, v = elm.value=='▲日付を選んで下さい'?null:elm.value; e.options.length = 0, e.disabled = true; if (v) { while (i<14) { d = new Date(v); d.setHours(24*i+72); txt = d.getFullYear() + '/' + (d.getMonth()+1) + '/' + d.getDate(); e.options[i++] = new Option(txt,txt); } e.disabled = false; } } </script> </head> <body> <div> <form name ="frm1" method="post" action="aaa.php" accept-charset="UTF-8"> <table> <tr> <td> <dl> <dt>ご希望日時</dt> <dd style="margin-left:150px;"> <p> <select name="hope_collect_day" style="margin-right: 50px" onchange="set();"> <!-- ご希望日の選択肢を吐き出す部分 --> <?php foreach ($collect_day_set as $key => $value): ?> <option value="<?php echo $value; ?>"><?php echo $value; ?></option> <?php endforeach; ?> </select> <select name="hope_collect_time"> <!-- 希望日時の選択肢を吐き出す部分 --> <?php foreach ($hope_time_set as $key => $value): ?> <option value="<?php echo $value; ?>"><?php echo $value; ?></option> <?php endforeach; ?> </select> </p> </dd> </dl> </td> </tr> <tr> <td> <dl> <dt>お渡しご希望日時</dt> <dd style="margin-left:150px;"> <p> <select name="hope_pass_day" style="margin-right:50px; width:150px"> <!-- お渡し希望日の選択肢を吐き出す部分 --> <?php foreach ($pass_day_set as $key => $value): ?> <option value="<?php echo $value; ?>"><?php echo $value; ?></option> <?php endforeach; ?> </select> <select name="hope_pass_time"> <!-- お渡し希望日時の選択肢を吐き出す部分 --> <?php foreach ($pass_time_set as $key => $value): ?> <option value="<?php echo $value; ?>"><?php echo $value; ?></option> <?php endforeach; ?> </select> </p> </dd> </dl> </td> </tr> <tr> <td> </td> </tr> </table> </div> </body> </html> ------------------------------------------------------------------

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

関連するQ&A

  • セレクトボックスの連動処理

    お世話になります。 JavaScript勉強中のもので、サンプルソースを見つけることができなかったので、質問させてください。 http://javascriptmarket.com/script/jsm07.html http://www.alink.co.jp/tech/blog/sample_code/js/team_json_20090404.html やりたいイメージとしては、上記のページのようなことです。 具体的には、日付の入るセレクトボックスを２つ用意し、 片方のセレクトボックスの日付を選択すると、もう片方のセレクトボックスに●日後の日付選択肢が表示される。 ということをしたいと思っています。 元々の日付の選択肢が静的であれば上記URLを参考にすれば作れる自信があるのですが、動的なものであまり自信がありません。。。 以下実際に作ったコードです。 （PHPで2つ目のセレクトボックスには3日後の日付が表示されるようにしています。） ---------------------------------------------------------- //日付 for($a = 0; $a < 14; $a++) { $timestamp[] = strtotime("+$a day"); } $day_set = array( "0"=>"▲日付を選んで下さい", "1"=>date( 'Y/m/d', $timestamp[0] ) , "2"=>date( 'Y/m/d', $timestamp[1] ) , "3"=>date( 'Y/m/d', $timestamp[2] ) , "4"=>date( 'Y/m/d', $timestamp[3] ) , "5"=>date( 'Y/m/d', $timestamp[4] ) , "6"=>date( 'Y/m/d', $timestamp[5] ) , "7"=>date( 'Y/m/d', $timestamp[6] ) , "8"=>date( 'Y/m/d', $timestamp[7] ) , "9"=>date( 'Y/m/d', $timestamp[8] ) , "10"=>date( 'Y/m/d', $timestamp[9] ) , "11"=>date( 'Y/m/d', $timestamp[10] ) , "12"=>date( 'Y/m/d', $timestamp[11] ) , "13"=>date( 'Y/m/d', $timestamp[12] ) , "14"=>date( 'Y/m/d', $timestamp[13] ) ); //お渡し日付セット for($a = 3; $a < 17; $a++) { $timestamp2[] = strtotime("+$a day"); } $day2_set = array( "0"=>"▲日付を選んで下さい", "1"=>date( 'Y/m/d', $timestamp2[0] ) , "2"=>date( 'Y/m/d', $timestamp2[1] ) , "3"=>date( 'Y/m/d', $timestamp2[2] ) , "4"=>date( 'Y/m/d', $timestamp2[3] ) , "5"=>date( 'Y/m/d', $timestamp2[4] ) , "6"=>date( 'Y/m/d', $timestamp2[5] ) , "7"=>date( 'Y/m/d', $timestamp2[6] ) , "8"=>date( 'Y/m/d', $timestamp2[7] ) , "9"=>date( 'Y/m/d', $timestamp2[8] ) , "10"=>date( 'Y/m/d', $timestamp2[9] ) , "11"=>date( 'Y/m/d', $timestamp2[10] ) , "12"=>date( 'Y/m/d', $timestamp2[11] ) , "13"=>date( 'Y/m/d', $timestamp2[12] ) , "14"=>date( 'Y/m/d', $timestamp2[13] ) ); <select name="day" style="margin-right: 50px"> <?php foreach ($day_set as $key => $value): ?> <option value="<?php echo $value; ?>"><?php echo $value; ?></option> <?php endforeach; ?> </select> <select name="day2" style="margin-right: 50px"> <?php foreach ($day2_set as $key => $value): ?> <option value="<?php echo $value; ?>"><?php echo $value; ?></option> <?php endforeach; ?> </select>

  • ２つのセレクトボックスを連動させたい

    ２つのセレクトボックスを連動させて、 片方の選択を変更すると、もう一方の選択できる範囲が限定されるようにしたい。 下記のようなソースでセレクトボックスを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>

  • 連動させたいセレクトボックスについて。

    こんにちは。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
  • 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のセレクトボックスの値を配列で指定したのですが初期値の表示がうまくいきません。 以下は現在のソースです。 $start_time[$j]はDBの取得値で取得配列と表示配列が一致するものを初期表示する というコードが以下になります $time_array = 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" ); 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"; } 疑問点ですが別条件で(たとえば$start_time[$j]にデータが0の時)配列の指定した値を選択したいです。 下記のようにそれぞれのvalue値の時に条件を指定すればできるのですが配列の時には どのように初期値を設定すればいいかわかりません。 　　　　　　　<option value="0" <?php if($start_time[$j] == "0") { echo "selected"; } ?>> 0 <option value="1" <?php if($start_time[$j] == "1") { echo "selected"; } ?>> 1</option> <option value="2" <?php if($start_time[$j] == "2") { echo "selected"; } ?>> 2</option> 　　　　　　　　・ 　　　　　　　　・ 　　　　　　　　・ 　　　　　　　　・ 条件を指定したときに初期値を設定したいです。どのように実装すればいいでしょうか。 よろしくいお願いします。

    • ベストアンサー
    • PHP
  • セレクトボックスの連動処理について

    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はまだ触り始めの為、初心者です。

  • accessコンボボックスで今日の日付のみ選択

    accessのフォームにあるコンボボックスで今日の日付のみ選択できるようにしたいです。 コンボボックスの右端の三角の記号をクリックすると今日の日付のみが候補としてでてくるような 設定の方法を教えてください。 値集合ソースには関数を入れることができなくて困っています。 ネットや本でいろいろ調べてみましたが、今日の日付前後3日を表示する方法はあっても 今日の日付のみを選択の候補として設定する方法がわかりませんでした。 また、フォームを開いたときにコンボボックスに今日の日付が自動で出てくる状態にする方法は わかったのですが、常時（コンボボックスの右端の三角をクリックしなくても）今日の日付が見えてしまいます。 コンボボックスの右端の三角をクリックして初めて今日の日付が選択できるようにしたいです。 access初心者です。宜しくお願いします。

  • セレクトボックスの初期選択状態(SELECTED)を動的にしたいのですが

    モーダル内に表示させるセレクトボックスで、毎回モーダル起動時ごとに、 セレクトボックス内の初期選択状態を変えたいと思っています。 １回目のモーダル起動時には本日の日付をSELECTEDにし、２回目以降は 前回のモーダル起動時に選択した値をSELECTEDにしたいと思っております。 いろいろな方法があると思うのですが(てっとりばやく、フラグを持たせる とか、クッキーを使うとか・・・)、正しく実行されず、困っています。 どなたか、よいアドバイスをください。お願いいたします。

  • 日付のセレクトボックスで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
  • 複数のセレクトボックスの値から別のセレクトボックス

    この度はお世話になります。 複数（４個）のselectboxからselectboxの値の組み合わせによって、別のselectbox（１個）の選択肢を変えたいのですが、どなたか助けていただけませんでしょうか？ 動作のイメージは以下の通りです。 selectboxAの選択肢：1,2,3,4,5, selectboxBの選択肢：あ,い,う,え,お, selectboxCの選択肢：ア,イ,ウ,エ,オ, selectboxDの選択肢：a,i,u,e,o, 上記の操作で、 selectboxA に1 selectboxB に い selectboxCに ウ selectboxDに e　と selectboxA に5 selectboxB に え selectboxCに ウ selectboxDに i の 組み合わせが選択されたときのみ、 selectbox E の選択肢に　あいうえお,かきくけこ,さしすせそ,が表示され、 それ以外のselectbox A～Dの選択肢の組み合わせの時はすべて、 たちつてと,なにぬねの,はひふへほ, の選択肢が表示されます。 各selectボックスの選択肢は、選択肢の数により増減します。 また選択肢Ａには数字を使ってますが、すべて文字列として扱いたいです。 ネット上でjavascript のサンプルプログラム等も見て、色々と試してみたのですが、 なかなかハードルが高く困っております。 当方素人。任意の集まりで使います。何卒よろしくお願い致します。

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

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

質問する