• ベストアンサー
※ ChatGPTを利用し、要約された質問です(原文:連動プルダウンについてです。)

連動プルダウンの作成について

このQ&Aのポイント
  • PHPとDBを使用したプログラムで、画像投稿画面に連動するプルダウンを作成したい。
  • HTMLで選択された値をDBに送り、関連するデータを取得してプルダウンで表示したい。
  • JavaScriptを利用して非同期通信を行い、PHPと連携する方法を教えてほしい。

質問者が選んだベストアンサー

  • ベストアンサー
  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.2

意図がうまくつたわっていないかもしれないので・・・ >サブミット これはformで<input type="submit" ... をつかって明示的にサブミットすることをおすすめています。 もちろんjavascriptで代替的にサブミットすることは可能です。 その際は、どういう状態になったらサブミットしていいのかを コーディングして、条件が一致したら処理をするというのが妥当です。 たとえばセレクトボックスA、Bが初期値ではなく、テキストボックス x,yに値がはいっている・・・など条件を考え、それに付随して オブジェクトにonchangeトリガーをはっておくということです。 javascriptについて理解が浅いのであれば勉強してくださいとしか いいようが・・・ またajaxについてはご指摘の通り非同期処理なので、特定の セレクトボックスのonchangeイベント処理だけ気にしておけば十分です。 zipを選ぶと住所がでるとか。まぁその程度

sscommon
質問者

お礼

だいぶお返事遅れて申し訳ありません。 回答ありがとうございます。 なんか少し勉強してやってみたらどうにかこうにか できました。難しいですね。 もう少し勉強してみます。 ありがとうございました。

全文を見る
すると、全ての回答が全文表示されます。

その他の回答 (1)

  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.1

考え方は3つ。 (1)Ajaxで処理する。 (2)全てのデータをあらかじめ読込んでおき、必要にあわせて表示する (3)フレーム系の処理 (1)>(2)>(3)の順でおすすめ (2は理論的には可能だが大きなデータはお勧めできない、 3はいまどきフレームっていうのは・・・) javascriptは所詮環境依存なのでやはりきちんと毎回サブミットして やるのがまっとうなやり方だと思います

sscommon
質問者

お礼

回答ありがとうございます。 AJAXが確かに便利で良さそうですね。 サブミットですが、プルダウンで どのように行えば良いのでしょうか? 今作成しているのが、各項目ごとに テキストボックスやプルダウン諸々があって、 それを記入後にサブミットといった形を取りたいので プルダウン記述してすぐサブミットといった形だと おかしなことにならないのでしょうか? あとjavascriptでの値の取り方、 それを経由してのjavascript側から php側での値の取り方といったこともよくわかりません。 お手数ですが、回答いただけるとありがたいです。 よろしくお願いします。

全文を見る
すると、全ての回答が全文表示されます。

関連するQ&A

  • プルダウンメニューの利用

    htmlのプルダウンメニューを使用した値計算のインタフェースを作成したいと思っています。 プルダウンメニューに設定するメニュー項目に値を設定し、 onChangeを使用して、その値だけをPHPプログラムに渡すようにしたいのですが、 JavaScript部分をどのように書けばいいのか判りません。 どなたかご教授お願いいたします。 <form name="formtest" action="test.php" method="post"> <table> <tr> <th>カテゴリ*</th> <td> <SELECT NAME="iPlanet" onchange=""> <OPTION VALUE="9" selected>初期値 <OPTION VALUE="0">サンプル1 <OPTION VALUE="1">サンプル2 </SELECT> </td></tr> </table> </form> onchangeでValueの値をPHPに送りたいのです。 よろしくお願いします。

  • プルダウン連動とリンク

    選択項目により連動するプルダウンを利用し、各々のページにリンクさせようと思っているのですが、上手くいきません。 一つ目のプルダウンで項目を選択⇒二つ目のプルダウンに項目が表示される⇒選択するとリンクする。 プルダウンはこちらのソースを利用しています。 http://d.hatena.ne.jp/Mars/20071109 連動リンクはこちらを参考にしました。 http://air.rulez.jp/shop/java/jt_pulldown.htm 現在のソースは下記のようになっています。 プルダウンの連動とリンク、それぞれ単体での動作確認は出来たのですが、組み合わせると上手くいきません。 最初のプルダウンで「YYY」を選択し、連動して次のプルダウンに表示される「yahooかgoogle」を選択したらURL先にリンクしたいのですが。 現在はプルダウンは連動はされるものの、2つめのプルダウンで項目を選択しても何も起こらない状態です。 ----------------------------------------------------------------- <script type="text/javascript" src="ConnectedSelect.js"></script> <form> <select id="SEL1"> <option value="XXX">XXX</option> <option value="YYY">YYY</option> </select> <select id="SEL2" onChange="top.location.href=value"> <optgroup label="XXX"> <option value="x1">x1</option> <option value="x2">x2</option> </optgroup> <optgroup label="YYY"> <option value="http://www.yahoo.co.jp/">yahoo</option> <option value="https://www.google.co.jp/">google</option> </optgroup> </select> </form> <script type="text/javascript"> ConnectedSelect(['SEL1','SEL2','SEL3']); </script> --------------------------------------------------------------- これはどのように修正すればリンクされるようになるでしょうか? また別の方法があればそちらでも構いません。 ご存知の方いらっしゃいましたらご教示ください。 よろしくお願いします。

  • プルダウンの値をphpファイルへ渡したい

    いつもお世話になっております。 現在、作成中のHPですが、データ取得をphpで行い表示をしています。 (1)a.phpでプルダウンのデータを取得し、b.phpで表示。 (2)b.phpでプルダウンを選択し、その値をtest.phpへ渡す。 (2)で、プルダウンの値を渡す処理がどうしてもうまくできず、 とても困っています。 どこを修正すればよいのかご教授願いたいのですが・・・。 スクリプトは下記の通りです。 ------------------------------------------------------- 【b.php】 <html> <head> <title>テスト</title> </head> <body> <SCRIPT language="JavaScript"> function testphp(){ try{ with(document.testform){ action="http://test/test.php"; test.value = testform.testselect[testform.testselect.selectedindex].value; method="POST"; submit(); } } catch(e) { alert("エラーは " + e.description + " です。"); } } </SCRIPT> <form name="testform" onchange="testphp()"> <select name="testselect"> <option value="あ">結果1</option> <option value="い">結果2</option> <option value="う">結果3</option> <option value="え">結果4</option> <option value="お">結果5</option> </select> </form> </body> </html> 【test.php】 <?php //変数処理 $a = @$_POST["test"]; print "渡された値:".$a; exit; ?> ------------------------------------------------- どうぞ、宜しくお願い致します。

  • プルダウンの初期値に関して

    教えて下さい。 PHPとJavascript、DBはMySWLを使用してプルダウンにて選択した 内容を、別のテキストエリアに表示させるような事をしようとしています。 javascriptで選択されたものを別エリアに表示させ、さらには前回値をテキストエリアに再表示させる事は可能ですが、次に登録しようとした際に、プルダウンを選択していないとせっかく登録した内容がプルダウンの初期値で上書きさせれてしまいます。 何か、テキストにデータが存在した場合には、プルダウンの情報で上書きしないか、そもそもプルダウンの内容を覚えておくような事はできないでしょうか。。。 現在作成している記述です。 print("<TR>\n"); print("<TD NOWRAP><FONT SIZE='3'><B>【行  先】</B></FONT></TD>\n"); print("<TD NOWRAP SIZE='30'><input name='text1' VALUE=$out></input>\n"); print("</TD>\n"); print("<TD><select name='am_note' ONCHANGE='ChangeSelection(this.form, this)'> <option value=' '>                      <option value='自席' style='background-color:#FFFFFF; color:#3366FF'>自席 </select>\n"); print("</TD>\n"); print("</TR>\n"); よろしくお願いします。

    • ベストアンサー
    • PHP
  • プルダウン 値保持 onchange

    失礼します、現在年月のプルダウンを作成しており プルダウン自体は年月の作成ができなのですが再読み込みした際に プルダウンに選択した値を保持して欲しいです。 現在リダイレクト先を自身にしております。また、onChangeでプルダウンをした際に読み込むようにしています。 ご教授頂きたいです。宜しくお願い致します。 htmlに埋め込んでいるので読みにくいかと思いますがご了承ください <form action="<?php $self ?>" method="POST"> <select name = "year" onChange="javascript:submit()"> <?php for ($y = 2000; $y < date(Y)+1; $y++) :?> <?php if($s == 0) : ?> <option value="<?php echo $y ?>">選択してください</option>; <?php ++$s ?> <?php endif; ?> <option value="<?php echo $y ?>"><?php echo $y ?></option> <?php endfor; ?> </select> <?php $a = array('1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'); ?> <select name = "month" onChange="javascript:submit()"> <?php foreach ($a as $key => $value) :?> <?php $b = $key + 1 ?> <?php if($h == 0) : ?> <option value="<?php echo $y ?>">選択してください</option> <?php ++$h ?> <?php endif; ?> <option value="<?php echo $b ?>"><?php echo $value ?></option> <?php endforeach; ?> </select> </form>

    • ベストアンサー
    • PHP
  • プルダウンを連動した際のPOST処理に関して

    プルダウンを連動した際のPOST処理に関して 初歩的な事で申し訳ありませんが、教えて下さい。 今現在、過去にも質問として登録されていた下記のソースに対し、自身で修正を加えて 記述をしております。 その中で、以下の連動したものの中で、プルダウンより選ばれたものをボタンで別ページ へPOSTしたいと考えております。 下の記述の場合、from の POST へは、既に自分を再読込みという記述がされていて、 ボタンを作成し、POST で飛ばす事ができません。。。 したの登録ボタンで別画面へ遷移するにはどのような方法があるでしょうか。。。 教えて下さい。 《内容》 <?php //DB接続 $dbcon=mysql_connect("localhost","abcd","defg"); //DB選択 mysql_select_db("zozozo"); ?> <html> <body> <form method="post" name="frm" action="a.php"> <select name="mkoumoku" onChange="submit()"> <?php $slctd = ((!isset($_POST['mkoumoku']) Or $_POST['mkoumoku'] == "none")?" selected":""); echo '<option value="none"'.$slctd.'>-------------</option>'."\n"; //table1を取得 $res=mysql_query("select distinct * from table1"); while ($rows=mysql_fetch_array($res)) { $slctd = (($_POST['mkoumoku'] == $rows['id'])?" selected":""); echo '<option value="'.$rows['id'].'"'.$slctd.'>'.$rows['kind'].'</option>'."\n"; } echo "</select>"; ?> <select name="skoumoku"> <option value="none" selected>-------------</option> <?php //table1に連動して項目を変えたいところのコード $res1=mysql_query("select * from table2 where table2.key='{$_POST['mkoumoku']}' order by id"); while ($rows=mysql_fetch_array($res1)) { echo '<option value="'.$rows['id'].'">'.$rows['name'].'</option>'."\n"; } echo "</select>"; //Dbクローズ mysql_close($dbcon); ?> <input type="submit" value="登録"> </form> </body> </html>

  • プルダウンメニューの選択肢の保持について

    こちらにはだいぶお世話になっています。 perlとpostgresを使用してcgiを作成しているのですが、 下記のコードでプルダウンメニューにDBの値を入れて、 DBにデータが追加されてもプルダウンにもデータが追加されているプルダウンメニューを作りました。 $sql="select * from testtable order by code"; $result = $conn -> prepare($sql1); $ref = $result -> execute; while(@ref = $result->fetchrow){ $options.="<option value='$ref[0]'>$ref[1]</option>\n"; } $select="<select name=''>\n<option value=''>選択してください</option>\n$options</select>\n"; print "$select"; データの検索時にこのプルダウンメニューを使っているのですが、選らんだ選択肢を例えばBとして 送信すると、一番上の「選択してください」に戻ってしまします。 これを送信してもその時選択した選択肢を残すやり方を教えて頂けますでしょうか? testtableの中身:      プルダウンメニュー化 |code|name|      |選択してください▼| | 1 | A |         |    A    | | 2 | B |        → |    B    | | 3 | C |         |    C    | | 4 | D |         |    D    |

  • 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>

  • プルダウンで別項目に値を代入したい(HTML SELECT)

    ホームページのプルダウン項目を選択すると直ぐ下にあるテキスト項目に値を設定するプログラムを作りたいのですが上手くいきません。 HTMLのSELECT句でonchange属性に記述するのは分りますが、その場合にはjavascriptで記述(例:onchange="fncSet();"等)します。 下記は記述を省略しましたが、option項目はDBのテーブルから読み込んでセットしています。 <select name=sel onchange="???">  <option value=" "> </option>  <option value="1">はい</option>  <option value="2">いいえ</option> </select> <input type=text name=txt value=""> この場合にselのonchangeで選択した項目の値をtxtに設定するにはどうすればいいのでしょうか? OS   :WIN2K ブラウザ :IE6 プログラム:HTML(asp,vbscript,javascript)

    • ベストアンサー
    • HTML
  • プルダウンメニューで値を渡したいのですが

    すみません。今phpとhtmlであるサイトを作っているのですが プルダウンメニューを選択した後、ボタンを押すことなく選択した途端ページ移動 して、値を持って行きたいのですがjavascriptはまったく知らないためやり方がわかりません。 いろいろググってそれらしいスクリプトを見つけたのですが以下だとまったく動的に反応しません。 (ページも移動しません) 最終的にpost[ffa]に値であるniやameなどを入れたいのですがどこをどういじれば良いでしょうか・・。 <form name="ffa" method="post" action="abc.php"> <script type="text/javascript"> <select name="sel1" onChange="document.forms['ffa'].submit()" > <option value="ni">日本</option> <option value="ame">アメリカ</option> <option value="igi">イギリス</option> <option value="su">スウェーデン</option> </select> </script>