- 締切済み
複数のプルダウンの連動とリンク
複数の連動するプルダウンを作成し、さらに最後のページをリンクで 飛ばしたいのですが、java初心者のためそのように記述してよいのか 分かりません。 ３つのプルダウンであれば他のページに記述例があったのですが、 増やす時などにどこをいじればよいか分かりませんでした。 下記ソースは他サイトからのものですが、最後のプルダウンにリンク貼れますか？ 他の記述でもかまいませんので教えてください。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" /> <script type="text/javascript"><!-- function ResetOptions( index ) { var select = document.getElementById( "select" + index ); while( select ) { for( var i = 0, len = select.length; i < len; i++ ) { select.options[0] = null; } CreateOption( select, "", "項目" + ( index - 1 ) + "を選択してください" ); index++; select = document.getElementById( "select" + index ); } } function CreateOption( select, key, value ) { var option = document.createElement( "OPTION" ); option.setAttribute( "value", key ); var text = document.createTextNode( value ); option.appendChild( text ); select.appendChild( option ); } function CreateOptions( index, value, pleaseSelect ) { var select = document.getElementById( "select" + index ); if( ! select ) { return; } for( var i = 0, len = select.length; i < len; i++ ) { select.options[0] = null; } var option, text, list; if( index > 1 ) { if( value ) { list = dataList[index-1][value]; } else { ResetOptions( index ); return; } } else { list = dataList[0]; } if( pleaseSelect ) { CreateOption( select, "", "↓選択してください" ); } for( var key in list ) { CreateOption( select, key, list[key] ); } ResetOptions( index + 1 ); } var dataList = [ { "asia": "アジア", "europe": "ヨーロッパ", "south_america": "南米" }, { "asia" : { "japan": "日本", "korea": "韓国" }, "europe": { "italy": "イタリア", "spain": "スペイン", "sweden": "スウェーデン" }, "south_america": { "brazil": "ブラジル", "argentina": "アルゼンチン" } }, { "japan": { "": "38位" }, "korea": { "": "45位" }, "italy": { "": "3位" }, "spain": { "": "4位" }, "sweden": { "": "30位" }, "brazil": { "": "2位" }, "argentina": { "": "1位" } } ]; window.onload = function() { CreateOptions( 1, null, true ); ResetOptions( 2 ); }; //--></script> </head> <body> <h1>サッカー世界ランク</h1> <p>地域：<select id="select1" onchange="CreateOptions( 2, this.options[this.selectedIndex].value, true );"></select></p> <p>国：<select id="select2" onchange="CreateOptions( 3, this.options[this.selectedIndex].value, false );"></select></p> <p>順位：<select id="select3"></select></p> </body> </html>
- ai0908
- お礼率20% (1/5)
- JavaScript
- 回答数2
- ありがとう数0
- みんなの回答 （2）
- 専門家の回答
みんなの回答
- bvltiggeari
- ベストアンサー率76% (33/43)
NO.1です。 「分かってるよ！」と思われるかもしれませんが一応… もし社内にできる方がいないのであれば、 外注（お金を払って作ってもらう）という手もあります。 私もそうですが、個人的に依頼されて作る方も大勢いらっしゃいます。 （個人は会社と違い破格の安さです） ここにそれっぽいコードを書いてもいいのですが、 失礼ながらもう1つの回答をした時に「こういう感じと提示しても 実際の内容に修正できなそう」と感じてしまいました。 意外と質問の数も多いですし…。 お急ぎでないなら、勉強が1番だと思います。 JavaScriptも書籍はたくさんあります。 ガンバって下さい！
- bvltiggeari
- ベストアンサー率76% (33/43)
http://qanda.rakuten.ne.jp/qa7817436.htmlで回答した者です。 先ほどのと違い、こちらはそれなりに高度です。 > 下記ソースは他サイトからのものですが、最後のプルダウンにリンク貼れますか？ 「最後のページをリンクで飛ばしたい」の意味が掴み兼ねますが、 ほとんどのことがJavaScriptで可能です。 > 増やす時などにどこをいじればよいか分かりませんでした。 この認識が間違っています。 この場合、ドコかをコピペすれば増えていくという単純なものではありません。 なので「複数」という曖昧な言葉では恐らくまた同様の質問をするかと思われます。 もっと具体的に「こうしたい！」という提示をして下さい。 それと気になったのですが、先ほどのを合わせてこれは何のサイトですか？ 趣味であれば、そんなに慌てず理解を深めてから作っていった方が、 後々項目の変更なども柔軟にできていいと思いますよ？
関連するQ&A
- 連動セレクトボックスを同一ページにもう一つ追加したい
今回質問させていただきたいのは同一ページ内に連動するセレクトリストを二つ付けたいのですが上手く起動してくれません。 説明下手ですみません・・ 例えばですけど htmlには、 <html> <head> <title>あ</title> <script type="text/javascript"> <!-- // --> </script> <script type="text/javascript"> <!-- window.onload=function (){ for(var i=0; i<data.length; i++){ document.FORM1.MENUA.options[i] = new Option(data[i][0],data[i][0]); } setSubMenu(0); }; function setSubMenu(no){ document.FORM1.MENUB.length=0; for(var i=1; i<data[no].length; i++){ document.FORM1.MENUB.options[i-1] = new Option(data[no][i].key,data[no][i].value); } } // --> </script> </head> <body> <form name="FORM1"> <select name="MENUA" onchange="setSubMenu(this.selectedIndex)"> </select> <br> <select name="MENUB" > </select> </form> </body> </html> 外部ファイルに data = [ // [メイン分類,サブ分類並び,…], ["北海道", {key:"函館市",value:"02_11"}, {key:"小樽市",value:"02_12"}, {key:"その他市町村",value:"02_099"}], ["青森", {key:"青森市",value:"03_01"}, {key:"弘前市",value:"03_02"}, {key:"その他市町村",value:"03_099"}], ["岩手県", {key:"盛岡市 ",value:"04_01"}, {key:"宮古市",value:"04_02"}, {key:"その他市町村",value:"04_099"}], ["宮城県", {key:"石巻市",value:"05_06"}, {key:"塩竈市",value:"05_07"}, {key:"その他市町村",value:"05_099"}] ]; この他にもう一つ別窓で <script type="text/javascript"> <!-- // --> </script> <script type="text/javascript"> <!-- window.onload=function (){ for(var i=0; i<data.length; i++){ document.FORM2.MENUC.options[i] = new Option(data[i][0],data[i][0]); } setSubMenu(0); }; function setSubMenu(no){ document.FORM2.MENUD.length=0; for(var i=1; i<data[no].length; i++){ document.FORM2.MENUD.options[i-1] = new Option(data[no][i].key,data[no][i].value); } } // --> </script> </head> <body> <form name="FORM2"> <select name="MENUC" onchange="setSubMenu(this.selectedIndex)"> </select> <br> <select name="MENUD" > </select> </form> </body> </html> 外部ファイルに data = [ // [メイン分類,サブ分類並び,…], ["プログラミング", {key:"HTML",value:"11_01"}, {key:"JavaScript",value:"11_02"}, {key:"その他市",value:"11_099"}], ["データベース", {key:"Oracle",value:"12_01"}, {key:"MySQL",value:"12_02"}, {key:"その他市",value:"12_099"}] ]; と書いたセレクトリストをもう一つ追加したいのです。 が何度やっても上手くいきません。
- ベストアンサー
- JavaScript
- ２つのプルダウンの連動に関して
２つのプルダウンの連動に関して javascript の話になってしまうかと思われますが、教えて下さい。 ２つのプルダウンを連動させたいと考えていますが、単純に決められた項目を初期値として 設定するようなプルダウンであれば問題なくできますが、テーブルから取得したデータをプルダウン にセットした後に制御を掛けたいと考えています。 以下のようなソースを活用できないか？と考えていますが、どのような方法があるでしょうか。。。。 《活用ソース》 <HEAD> <TITLE></TITLE> <SCRIPT LANGUAGE=JavaScript> <!-- function funcSubmit() { if (document.formMain.pref.selectedIndex == 0 && document.formMain.city.selectedIndex == 0) { window.alert("都道府県と市町村を選択してください"); return false; } else { return true; } } function funcMain(b) { if (document.formMain.pref.selectedIndex == 0) { document.formMain.city.length = 1; document.formMain.city.selectedIndex = 0; } else { if (b) { document.formMain.city.length = 1; document.formMain.city.selectedIndex = 0; } var city = cities[document.formMain.pref.selectedIndex - 1]; document.formMain.city.length = city.length + 1; for (var i = 0; i < city.length; i++) { document.formMain.city.options[i + 1].value = i; document.formMain.city.options[i + 1].text = city[i]; } } } ↓↓↓↓ ※これらの情報をテーブルから取得したデータとしたい。↓↓↓↓ var prefs = new Array("東京都", "大阪府", "愛知県", "千葉県"); var cities = new Array(); cities[0] = new Array("小平市", "町田市", "三鷹市"); cities[1] = new Array("大阪市", "豊中市"); cities[2] = new Array("名古屋市", "半田市"); cities[3] = new Array("千葉市", "市川市", "柏市"); // --> </SCRIPT> </HEAD> <BODY onLoad="funcMain(false)"> <FORM NAME=formMain METHOD=POST ACTION=result.asp onSubmit="return funcSubmit()"> <SELECT NAME="pref" onChange="funcMain(true)"> <OPTION VALUE="" SELECTED>(都道府県を選択してください) <OPTION VALUE="0">東京都 <OPTION VALUE="1">大阪府 <OPTION VALUE="2">愛知県 <OPTION VALUE="3">千葉県 </SELECT> <SELECT NAME="city"> <OPTION VALUE="" SELECTED>(市町村を選択してください) <OPTION VALUE=""> <OPTION VALUE=""> <OPTION VALUE=""> <OPTION VALUE=""> <OPTION VALUE=""> <OPTION VALUE=""> <OPTION VALUE=""> </SELECT> <INPUT TYPE=submit VALUE="登録"> </FORM> </BODY> </HTML>
- ベストアンサー
- PHP
- セレクトボックス連動
過去の質問にありましたソースを参考にセレクトボックスの 連動タイプをphpを絡めて作っています。 DBから取出した menua に入る値を初期値に設定したいのですが うまくいきません。 menua には AAA、BBB、CCCが入ります。 初期値を変えるにはどのようにすればいいのでしょうか。 また、menua以外にもmenubの初期値も変える事が出来るのでしょうか。 以下ソースになります。 <? $menua = "BBB"; ?> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <script type="text/javascript"> <!-- data = [ ["AAA", {key:"A01",value:101}, {key:"A02",value:102}, {key:"A03",value:103}], ["BBB", {key:"B01",value:201}, {key:"B02",value:202}, {key:"B03",value:203}], ["CCC", {key:"C01",value:301}, {key:"C02",value:302}, {key:"C03",value:303}] ]; // --> </script> <script type="text/javascript"> <!-- window.onload=function (){ for(var i=0; i<data.length; i++){ document.FORM1.menua.options[i] = new Option(data[i][0],data[i][0]); } setSubMenu(0); }; function setSubMenu(no){ document.FORM1.menub.length=0; for(var i=1; i<data[no].length; i++){ document.FORM1.menub.options[i-1] = new Option(data[no][i].key,data[no][i].value); } } // --> </script> </head> <body> <form name="FORM1"> <select name="menua" onchange="setSubMenu(this.selectedIndex)"> </select> <select name="menub" > </select> </form> </body> </html>
- ベストアンサー
- JavaScript
- プルダウンメニューに連動するdisableの切替で
以前こちらで、selectメニューに連動するdisableの切替方法をお聞きして、下記のようなものを作成しました。 ここでCGIの仕様上、selectメニュー内のvalue値に日本語（1単語）を使用したいと思い、value値以外の値を取得しようとしてみましたが、うまくいきません。 何かよい方法はありますでしょうか？ <html> <head> <script type="text/javascript"> window.onload = function(){ disableAllGr(); } function disableAllGr(){ var inputList = document.getElementsByTagName('p'); for(var i=0;i<inputList.length;i++){ var obj=inputList[i]; if(obj.id.match(/^gr_/)){ var n=obj.firstChild; while(n){ if(n.nodeName=="INPUT" && n.type=="radio") n.disabled=true; if(n.nodeName=="INPUT" && n.type=="checkbox") n.disabled=true; if(n.nodeName=="INPUT" && n.type=="text") n.disabled=true; if(n.nodeName=="SELECT") n.disabled=true; n=n.nextSibling; } } } } function fchk2(obj) { disableAllGr(); var nameList = obj.value.split(/,/); for( var i in nameList){ if(!document.getElementById('gr_'+nameList[i])) return false; var n=document.getElementById('gr_'+nameList[i]).firstChild; while(n){ if(n.nodeName=="INPUT" && n.type=="radio") n.disabled=false; if(n.nodeName=="INPUT" && n.type=="checkbox") n.disabled=false; if(n.nodeName=="INPUT" && n.type=="text") n.disabled=false; if(n.nodeName=="SELECT") n.disabled=false; n=n.nextSibling; } } } </script> </head> <body> <form> <p id="ctr_FLAG"> <select onchange='fchk2(this)'> <option selected="selected" value="">選んでください</option> <option value="A,A2">Aをアクティブ</option> <option value="A,A2,B,B2">AとBをアクティブ</option> <option value="A,A2,B,B2,C,C2">AとBとCをアクティブ</option> </select> </p> <p>A---------------------</p> <p id="gr_A"> <input type="radio" value="2mm" />テストA <input type="radio" value="3mm" />テストAA </p> <p id="gr_A2"> <input type="checkbox" value="2mm" /> テストA <input type="checkbox" value="3mm" /> テストAA </p> <p>B-----------------------</p> <p id="gr_B"> <input type="radio" value="2mm" />テストB <input type="radio" value="3mm" />テストBB </p> <p id="gr_B2"> <input type="checkbox" value="2mm" />テストB <input type="checkbox" value="3mm" />テストBB </p> <p>C-----------------------</p> <p id="gr_C"> <input type="radio" value="2mm">テストC <input type="radio" value="3mm"/>テストCC </p> <p id="gr_C2"> <input type="checkbox" value="2mm"> テストC <input type="checkbox" value="3mm"/>テストCC </p> <p>-----------------------</p> <p><input type="submit"></p> </form> </body> </html>
- ベストアンサー
- JavaScript
- 3つの連動したプルダウンメニューのフォームについて
http://d.hatena.ne.jp/Mars/20071109 こちらのページを参考にしてフォームの中身を以下ようにしたいのです。 このような感じです <select id=”SEL1”> <optgroup label=”choise”> <option value=”fruit”>フルーツ</option> <option value=”vegetable”>野菜</option> </select> <select id=”SEL2”> <optgroup label=”fruits”> <option value=”x1”>みかん</option> <option value=”x1”>りんご</option> <option value=”x1”>メロン</option> </optgroup> <optgroup label=”vegetable”> <option value=”x1”>キャベツ</option> <option value=”x1”>きゅうり</option> <option value=”x1”>トマト</option> </optgroup> </select> <select id=”SEL3”> <optgroup label=”x1”> <option>1個</option> <option>2個</option> <option>3個</option> <option>4個</option> <option>5個</option> <option>6個</option> </optgroup> </select> このようにプルダウンメニューを３階層にして、3段階目に繋げる２段階目のoption valueは全て同じにしたいのですが、 そうすると、フォームで送信した結果が select id=SEL2 のところで全てが ”x1”になってしまい各商品の名前を出すことができません。 何か方法があれば教えてください。 使っているジャバスクリプトは以下です function ConnectedSelect(selIdList){ for(var i=0;selIdList[i];i++) { var CS = new Object(); var obj = document.getElementById(selIdList[i]); if(i){ CS.node=document.createElement('select'); var GR = obj.getElementsByTagName('optgroup'); while(GR[0]) { CS.node.appendChild(GR[0].cloneNode(true)); obj.removeChild(GR[0]); } obj.disabled = true; } if(selIdList[i+1]) { CS.nextSelect = document.getElementById(selIdList[i+1]); obj.onchange = function(){ConnectedSelectEnabledSelect(this)}; } else { CS.nextSelect = false; } obj.ConnectedSelect = CS; } } function ConnectedSelectEnabledSelect(oSel){ var oVal = oSel.options[oSel.selectedIndex].value; if(oVal) { while(oSel.ConnectedSelect.nextSelect.options[1])oSel.ConnectedSelect.nextSelect.remove(1); var eF = false; for(var OG=oSel.ConnectedSelect.nextSelect.ConnectedSelect.node.firstChild;OG;OG=OG.nextSibling) { if(OG.label == oVal) { eF = true; for(var OP=OG.firstChild;OP;OP=OP.nextSibling) oSel.ConnectedSelect.nextSelect.appendChild(OP.cloneNode(true)); break; } } oSel.ConnectedSelect.nextSelect.disabled = !eF; } else { oSel.ConnectedSelect.nextSelect.selectedIndex = 0; oSel.ConnectedSelect.nextSelect.disabled = true; } if(oSel.ConnectedSelect.nextSelect.onchange)oSel.ConnectedSelect.nextSelect.onchange(); }
- 締切済み
- JavaScript
- 2つのプルダウンを連動させて、selectedで選択状態にしたい
JavaScript初心者です。 今、phpとMySQLとJavaScriptで車の情報を登録する画面を作っています。 1つのプルダウンが選択後、もうひとつのプルダウンを表示するのですが、 入力画面から確認画面へ移って、history.backでもう一度入力画面にもどったときに、 選択された状態で表示したいのです。 下記のmakerは、値をセッションで受け取り、selectedをつける指示を したので、 選択状態にすることができました。 もう一つのcarnameがどうしたらよいか分かりません。 どうかご教授お願い致します。 <head> <script type="text/javascript"> <!-- var area=0; function setArea(n) { area=n; carnameItem = [ //トヨタ ['カローラ','クラウン','セルシオ'], //ニッサン ['シーマ','エルグランド','ローレル'], len = document.form1.carname.options.length; for (i=len-1; i>0; --i)document.form1.carname.options[i] = null; if(n!=0){ document.form1.carname.style.visibility = "visible"; for (i=0; i<carnameItem[n-1].length; i++)document.form1.carname.options[i+1] = new Option(carnameItem[n-1][i]); } setPref(0); } //--> </script> </head> <body> <form name="form1"> <select name="maker" onChange="setArea(this.selectedIndex)"> <option value="0"<?php echo $selected1?>>▼選択してください</option> <option value="1"<?php echo $selected1?>>トヨタ</option> <option value="2"<?php echo $selected2?>>ニッサン</option> </select> <select name="carname" onChange="setPref(this.selectedIndex)"><option value="0" selected>▼選択してください</option></select> </form>
- 締切済み
- JavaScript
- プルダウン２つで別項目に値を代入したい．その２
同じような質問ですみません。プルダウン２つで別項目に値を代入する方法のアドバイスを参考にこんなの作ったんですがうまくいかないです。どこがおかしいですか？ <html> <script type="text/javascript"> function hoge(){ var v1=document.getElementById('s1').value; var v2=document.getElementById('s2').value; var rslt; if (v1==1 && v2==1) { rslt=36; } else { if (v1==1 && v2==2) { rslt=29; } else { if (v1==1 && v2==3) { rslt=22; } else { if (v1==1 && v2==4) { rslt=14; } else { if (v1==1 && v2==5) { rslt=7; } else { if (v1==1 && v2==6) { rslt=0; } else { rslt='?'; }} document.getElementById('txt').value=rslt; } </script> <body> <select id="s1" onChange="hoge()"> <option value="1">1 <option value="2">2 <option value="3">3 <option value="4">4 </select> <select id="s2" onChange="hoge()"> <option value="1">1 <option value="2">2 <option value="3">3 <option value="4">4 <option value="5">5 <option value="6">6 </select><p> <input type="text" id="txt" value=""> </body> </html>
- 締切済み
- Java
- 連動プルダウン 確認画面から戻ると初期化される
いつもお世話になります。 javascript初心者です。 以下のページを参考に、プルダウンが連動して選択肢が変わるフォームを作成しました。 http://d.hatena.ne.jp/Mars/20071109 ==HTML ココカラ============================================= <html> <head> <script src="./js/ConnectedSelect.js" type="text/javascript"></script> </head> <body> <form> <select name="sel1" id="SEL1"> <option value="" selected>--------- 選択してください ---------</option> <option value="1" >果物</option> <option value="2" >野菜</option> </select> <select name="sel12" id="SEL2"> <option value="" selected>--------- 選択してください ---------</option> <optgroup label="1"> <option value="1" >モモ</option> <option value="2" >スイカ</option> <option value="3" >ブドウ</option> </optgroup> <optgroup label="2"> <option value="4" >きゅうり</option> <option value="5" >トマト</option> <option value="6" >レタス</option> </optgroup> </select> <script type="text/javascript"> ConnectedSelect(['SEL1','SEL2']); </script> <input type="submit" value="確認"> </form> </body> </html> ==HTML ココマデ============================================= ==ConnectedSelect.js ココカラ============================== function ConnectedSelect(selIdList){ for(var i=0;selIdList[i];i++) { var CS = new Object(); var obj = document.getElementById(selIdList[i]); if(i){ CS.node=document.createElement('select'); var GR = obj.getElementsByTagName('optgroup'); while(GR[0]) { CS.node.appendChild(GR[0].cloneNode(true)); obj.removeChild(GR[0]); } obj.disabled = true; } if(selIdList[i+1]) { CS.nextSelect = document.getElementById(selIdList[i+1]); obj.onchange = function(){ConnectedSelectEnabledSelect(this)}; } else { CS.nextSelect = false; } obj.ConnectedSelect = CS; } } function ConnectedSelectEnabledSelect(oSel){ var oVal = oSel.options[oSel.selectedIndex].value; if(oVal) { while(oSel.ConnectedSelect.nextSelect.options[1])oSel.ConnectedSelect.nextSelect.remove(1); var eF = false; for(var OG=oSel.ConnectedSelect.nextSelect.ConnectedSelect.node.firstChild;OG;OG=OG.nextSibling) { if(OG.label == oVal) { eF = true; for(var OP=OG.firstChild;OP;OP=OP.nextSibling) oSel.ConnectedSelect.nextSelect.appendChild(OP.cloneNode(true)); break; } } oSel.ConnectedSelect.nextSelect.disabled = !eF; } else { oSel.ConnectedSelect.nextSelect.selectedIndex = 0; oSel.ConnectedSelect.nextSelect.disabled = true; } if(oSel.ConnectedSelect.nextSelect.onchange)oSel.ConnectedSelect.nextSelect.onchange(); } ==ConnectedSelect.js ココカラ============================== ちゃんと連動できて喜んでいたのですが、入力画面から確認画面に移動し、修正するために戻ると、子プルダウンの値が初期状態（選択していない状態）に戻ってしまっていました。 こちらを選択した状態を保持しておく方法はないでしょうか。 教えていただけましたら助かります。 よろしくお願いします。
- ベストアンサー
- JavaScript
- PHP+Ajaxでプルダウンの連動
お世話になっております。久しぶりですが、わからないところが出てきたので、質問させてくださいませ。 現在、PHP+MySQLでホームページを作っています。 A(大カテゴリ)、B(小カテゴリ)のそれぞれのプルダウンを持っていて、 MySQL上では、BはどのAに所属しているかが格納されています。 その上で、 PHPソース <script type="text/javascript" src="ajax.js"></script> Aの部分 <select name="category" id="category" onChange="changePack(this)"> <option value="">--</option> <option value="1">A-1</option> <option value="2">A-2</option> <option value="3">A-3</option> </select> Bの部分 <select name="pack" id="pack"> <option value="">--</option> </select> Ajax部分のソース // 検索結果画面初期表示用 function setList() { var Category = "0"; var Pack = "0"; setPackOption(Category); document.rsv_input.category.selectedIndex = 0; document.rsv_input.pack.selectedIndex = 0; } // カテゴリ選択時 function changePack(Category) { var Category; getResult(Category.value); } function getResult(Category) { //XMLHttpRequestオブジェクト生成 var xmlhttp = createHttpRequest(); if (xmlhttp == null) { return null; } var data = ""; data += "category=" + Category; sendRequest(xmlhttp, "POST", "result.php", false, data, callBack); } function callBack(xmlhttp) { var result = xmlhttp.responseText; var resArray = result.split(","); for (i=0; i<resArray.length; i++) { var packArray = resArray[i].split("/"); document.rsv_input.pack.options[i] = new Option(packArray[1], packArray[0]); } } relust.phpのソース $category = ( $_POST["category"] != "0" )? $_POST["category"] : ''; select文で「$category」を持つ、レコードから「小カテゴリ」のid、名称 を取得 $id = $Cols['id']; $name = $Cols['name']; $data .= ',' . $id . '/' . $name; echo($data); としておりますが、小カテゴリのプルダウンに$dataの中身が反映されません。(result.phpの$_POSTを$_GETに変更して単体で動かした場合は、$dataが読み取れる状態になります。) http://www.okushin.co.jp/information/Ajax_report/06_sample02.php を参考にさせていただいていますが、プルダウンの総数が違う。や、最終結果をテキストデータとしてhtml中に書き出すなど若干の相違点でつまずいています。 当方、PHP(0.5年)、JavaScript(0.5年)位の経験しか持ち合わせていないので、余計にわかってないだけかも知れません。 お手数をおかけいたしますが、修正箇所の指摘やその方法などを教えていただけませんでしょうか。よろしくお願いいたします。
- ベストアンサー
- PHP
- 複数のプルダウン
いつも参考にしております。 プルダウンが選択後、もうひとつのプルダウンを表示したいと 思っておりますが、うまく表示されません。 1つめのプルダウンの選択によって、2つめのプルダウンのメニューは 異なります。 <!-- function setArea(n) { prefItem = [["▼選択してください"], ["▼選択してください", "千葉県", "東京都", "神奈川県", "山梨県"], ["▼選択してください", "新潟県", "長野県", "富山県"], ["▼選択してください", "静岡県", "愛知県", "岐阜県", "三重県"], len = document.form1.PrefID.options.length; for (i=0; i<len; i++) { document.form1.PrefID.options[i] = null; } document.form1.PrefID.style.visibility = "visible"; for (i=0; i<prefItem[n].length; i++) { document.form1.PrefID.options[i] = new Option(prefItem[n][i]); } } //--> <select name="AreaID" onChange="setArea(this.selectedIndex)"> <option value="0" selected>▼選択してください</option> <option value="1">関東</option> <option value="2">甲信越・北陸</option> <option value="3">東海</option> </select> <select name="PrefID" style="visibility:hidden"> たとえば、1つめのプルダウンを「関東」を選択すると 2つめのプルダウンに「千葉県, 東京都, 神奈川県, 山梨県」 と表示されますが、その後「▼選択してください」を選択すると 「▼選択してください, 神奈川県」と2つのメニューが表示されてしまいます。 メニューを削除して、新しく生成しています。 なので、「▼選択してください」と1つだけのメニューになるはずだと思うのですが。 ご教授お願いいたします。
- ベストアンサー
- JavaScript
補足
ご丁寧に有難うございます。javascriptとはとても深く難しいのですね。 コピーペーストで何とかなると思っていたのですが、無理そうで残念です。 今会社で社内のポータルサイトを作成していて、質問形式で絞込み最後に答えを表示したいと思いました。質問は多いものでは６つ、少ないものであれば２つで答えにたどりつくというものです。 しかし、私には難しすぎたようです。 色々とアドバイス有難うございました。 基礎から勉強しようと思います。