コンボボックス１の条件でコンボ２選択肢をクエリで動的に取得したい

締切済

質問者：smython
質問日時：2008/10/01 20:18
回答数：1件

早速ですが、現在PHP&Javascriptでサイト構築中です。
その中で、コンボボックス１で選択した条件でコンボボックス２の
選択肢を動的に変化させたいのですが、画面ロード時に全てのパターン
を読み込むのではなく（これはサンプルを見つけました）、
コンボ１選択時にクエリを発行してコンボ２の選択肢を取得して
反映させることは可能でしょうか。
可能であれば、具体的な実現方法をご教示願えませんでしょうか。
未熟故、的外れな質問でしたらご指摘下さい。

よろしくお願いいたします。

通報する

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

質問の本文を隠す

回答 (1件)

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

No.1

回答者： _pipi_
回答日時：2008/10/03 17:07

<html>

<head>
<script type="text/javascript" src="prototype.js"></script>
</head>
<body>
<form>
<select id="a" onChange="changeOption('b',this.value)">
<option value="0" selected>好みは？</option>
<option value="1">普通</option>
<option value="2">やばい</option>
</select><br>
<select id="b">
</select>
<script>
function changeOption(id,val){
var tm = (new Date()).getTime();
new Ajax.Request('test.php', { method:'get', parameters:'menu='+val+'&c='+tm, onSuccess:function(oj){retData(id,oj.responseText); } });
}
function retData(id,oj){
var dt=oj.split('\n');
var txt=[];
var val=[];
for(var i=0;i<dt.length;i++){
var buf=dt[i].split('\t');
val.push(buf[0]);
txt.push(buf[1]);
}
setSelectOption(id,txt,val,val[0],val[0]);
}
function setSelectOption(id_name ,text_array, value_array, default_value, select_value){
var o = document.getElementById( id_name );
while( o.hasChildNodes() ) o.removeChild( o.lastChild );
for(var i=0, n, mx = text_array.length; i<mx; i++){
var n = new Option( text_array[i], value_array[i],(default_value==value_array[i]),(select_value==value_array[i]));
try{ o.add( n, null) } catch( ex ){ o.add( n ); }
}
}
</script>

---------------
test.php
<?php
$menu=$_GET['menu'];
$ret ='';
switch( $menu ){
case '1':
$ret="0\t指定してください\n1\t男\n2\t女"; break;
case '2':
$ret="0\t指定してください\n1\tオカマ\n2\tオナベ"; break;
default:
$ret="0\tありません"; break;
}
echo $ret;