MySQLのデータを使ってプルダウンの値を動的に変更したい

締切済

質問者：trigene
質問日時：2007/05/18 20:05
回答数：3件

以下の授業プルダウンですが、
任意の授業が選択されたときに、
その授業の内容を大分類の下の中分類(middle_class)をDBで検索して、次の中分類プルダウンの変数に渡したいのですが、当然のごとくでき
ません。

大分類で画面遷移して中分類の画面へというように、何回も検索画面
を分けるのならいいのですが。何度も処理をする必要があるので、
絶対に画面遷移しない。orしているように見えないようにしたいです。

下記サイト一番役立つかなぁと思いましたが、マスターデータはDBから検索させたい。
Javascriptsに直書きは、メンテナンスが難しい。
http://www.cc.kyoto-su.ac.jp/~ushitaki/JavaScrip …

<SCRIPT LANGUAGE="JavaScript">


</SCRIPT>
</HEAD>
<BODY LANG="ja-JP" TEXT="#0066cc" LINK="#cc0033" VLINK="#ff9900" BGCOLOR="#ffffff" DIR="LTR">

<TABLE WIDTH=1072 BORDER=1 CELLPADDING=2 CELLSPACING=0 STYLE="page-break-before: always">
<COL WIDTH=531>
<COL WIDTH=531>
<TR>
<TD WIDTH=531 HEIGHT=25>
<P>　授業別クラス
</P>
</TD>
<TD ROWSPAN=7 WIDTH=531>
<P><BR>
</P>
</TD>
</TR>
<TR>
<TD WIDTH=531 HEIGHT=20>
<P>授業検索</P>
</TD>
</TR>
<TR>
<TD WIDTH=531 HEIGHT=20>
<FORM NAME="category">
<P><FONT SIZE=2 STYLE="font-size: 9pt">大分類
<SELECT NAME="$top" STYLE="width: 2.43cm; height: 0.56cm" onChange="this.form.submit()">
<OPTION VALUE="x">大分類
<OPTION VALUE="MATH">数学
<OPTION VALUE="JAPE">国語
<OPTION VALUE="JAPH">日本史
<OPTION VALUE="CHEM">化学
<OPTION VALUE="PHYS">物理
<OPTION VALUE="FORL">外国語
<OPTION VALUE="WORH">世界史
</OPTION>
</SELECT></FONT></P>
</TD>
</TR>
<TR>
<TD WIDTH=531>
<P><FONT SIZE=2 STYLE="font-size: 9pt">中分類
<SELECT NAME="middle" STYLE="width: 4.52cm; height: 0.56cm" ONCHANGE="getparts()">
<OPTION VALUE="x" SELECTED>まず大分類を選んでください
<OPTION VALUE="x">
<OPTION VALUE="x">
<OPTION VALUE="x">
<OPTION VALUE="x">
<OPTION VALUE="x">
<OPTION VALUE="x">
<OPTION VALUE="x">
<OPTION VALUE="x">
<OPTION VALUE="x">
<OPTION VALUE="x">
<OPTION VALUE="x">
<OPTION VALUE="x"></OPTION>
</SELECT></FONT></P>
</TD>
</TR>
<TR>
<TD WIDTH=531>
<P><INPUT TYPE=SUBMIT VALUE="検索" STYLE="width: 1.08cm; height: 0.58cm"></FORM>
</P>
</TD>
</TR>
</TABLE>

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (3件)

最新から表示
回答順に表示

No.3

回答者： moon_night
回答日時：2007/05/19 10:12

Ajaxの参考サイトです。

http://www.openspc2.org/JavaScript/Ajax/
http://allabout.co.jp/career/javascript/closeup/ …

- 0
- 件

通報する

No.2

回答者： yambejp
回答日時：2007/05/18 21:17

>本題と離れてしましますが、ajaxで実現できるのであれば、

>このあたり参考になる本があれば、教えていただけませんか？

うーん、私はajaxについてはネット上でサンプルを拾ったことしか
ないので書籍については一切持ってません。
「ajax 書籍」などでぐぐってみるとそれなりにでてくるかもしれませんが
そうするくらないならajaxで検索してソースをいろいろ拾い集めたほうが
てっとりばやいかも。

>ちなみにajaxとPHPって連携できるのでしょうか？

ajaxは単なるjavascriptですからajaxからセレクトボックスを
呼び出すことは問題なくできます。
セレクトボックス自体をPHPでかけばまさにajaxとPHPの連携ですね。

>ただ最後に２行があまり理解できませんでした

>>onChangeではなくsubmitで正規に検索するのであればjavascriptを
>>使わずにすむのでブラウザに依存しないシステム運用も可能です。

書き方がわるくてすみません。
毎回サブミットボタンをおして検索するシステムなら、ブラウザが
変わっても、たとえば携帯からアクセスしても、つかえるます・・・
ってことがいいたかっただけです。（そのあたりはご理解なさっている
とは思いますが・・・）

この回答への補足

ajaxの書籍を買って、少し斜め読みしてみました。
手順としては、
1.○○.html(ajaxlib:jslb_ajax.js含む )
<SELECT *** onChange="sendRequest(on_loaded1,'$category','GET','./middle_class.php',true,true)">
で△△.phpに投げる。

2.△△.phpで
mysql_fetch_arrayで$table3の2次元配列に入れる。
$table3[0][0] = 1
$table3[0][1] = 歴史
$table3[1][0] = 2
$table3[1][1] = 数学
な感じに。

for($i = 0; $i < $count; $i++){
$kyouka = $kyouka." ".$table3[$i][0]." ".$table3[$i][1];
}

//出力をUTF-8に変更
mb_http_output('utf-8');

//出力
echo ( $kyouka );

３．△△.phpでbashされた$table3をon_loaded1(oj)で捕まえる。
function on_loaded1(oj){

var res = oj.responseText <---ここで受け取れてないかも。
　　　　alart(res) <---何も表示されない。


var row = res.split(' ')
alart(row[0])

oj.responseTextでデータが取得できていません。
△△.php自体の動作はO.K.だけど、○○.htmlのjavascriptが
うまく動作しているのか？です。

補足日時：2007/05/24 16:43

通報する

- 0
- 件

通報する

No.1

回答者： yambejp
回答日時：2007/05/18 20:19

大分類を選ぶたびに、画面遷移なしでDBを読みにいくのであれば

ajaxをつかってください。

もしくは大分類を選ぶたびにonChangeでformをサブミットして、
中分類をよみにいくというフローもできます。
onChangeではなくsubmitで正規に検索するのであればjavascriptを
使わずにすむのでブラウザに依存しないシステム運用も可能です。

この回答への補足

onChangeでフォームを飛ばしたいことも要求として
あります。
毎回毎回、<INPUT TYPE=SUBMIT VALUE="検索" STYLE="width: 1.08cm; height: 0.58cm">
を押してから、フォームを渡すのは、面倒だから。

ajaxって使ったことないんですけど。
これが実現できるのであればajaxに挑戦する価値は大です。
本題と離れてしましますが、ajaxで実現できるのであれば、
このあたり参考になる本があれば、教えていただけませんか？

ちなみにajaxとPHPって連携できるのでしょうか？

ただ最後に２行があまり理解できませんでした。
未熟なので申し訳ないところです。