たとえば、
都道府県を変えたら、市町村名を変えたいという時や、
大分類を変えたら、それにあわせて小分類を変えるという時、
こんなふうにしますよね。
で、この
はじめのセレクタ(都道府県とか)が切り替わったら、
サーバーアクセスして
あとのセレクタ(市町村名とか)の中身を変える
方法について。
■概要(一般論)
これは
・はじめのセレクタの値が変わったら、ajaxで、あとのデータを取ってくる
ように、画面側を書く
・サーバー側では、上記によって呼び出されたら、DBをアクセスして、
必要な部分だけを書き出す
ということをする。
今回は、これを(後者を)Zendで行う例を示す。
■サンプル
はじめのセレクタで選んだ数に後のセレクタの内容が変わります。
(いや、これじゃあ、2倍する答えが求められるだけで、何の意味もないけど、
サンプルとして)
■画面側(一般的に)
画面側は、セレクタの値が変わったら、onChangeで指定された関数に飛んで、
そこで、AJAXで後の値をとってきて、それを、後のセレクタにセットするように
JQueryで書きます。
■サーバー側(Zendを使用した場合)
Zendを使う場合、クライアントからの要求に対して、コントローラーとViewが最低でも必要になります。
○コントローラーについて
画面から呼ばれたコントローラーのActionに対して、値を取得して、それに対応するデータをDBから、本来取ってくるのですが、今回はそれは面どっちいので、DBアクセスしないで、値をそのままadd2にセットしちゃっています。
○画面部分
add2をセットしています。
都道府県を変えたら、市町村名を変えたいという時や、
大分類を変えたら、それにあわせて小分類を変えるという時、
こんなふうにしますよね。
で、この
はじめのセレクタ(都道府県とか)が切り替わったら、
サーバーアクセスして
あとのセレクタ(市町村名とか)の中身を変える
方法について。
■概要(一般論)
これは
・はじめのセレクタの値が変わったら、ajaxで、あとのデータを取ってくる
ように、画面側を書く
・サーバー側では、上記によって呼び出されたら、DBをアクセスして、
必要な部分だけを書き出す
ということをする。
今回は、これを(後者を)Zendで行う例を示す。
■サンプル
はじめのセレクタで選んだ数に後のセレクタの内容が変わります。
(いや、これじゃあ、2倍する答えが求められるだけで、何の意味もないけど、
サンプルとして)
■画面側(一般的に)
画面側は、セレクタの値が変わったら、onChangeで指定された関数に飛んで、
そこで、AJAXで後の値をとってきて、それを、後のセレクタにセットするように
JQueryで書きます。
<HTML> <HEAD> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script> <SCRIPT type="text/JavaScript"> <!-- function henkou(){ $.ajax({ scriptCharset:"UTF-8", dataType:"text", data:{add1:$("#add1 option:selected").val()}, url:"/ZendAdd5/Index/change", complete : function(data,sts){ $("#add2").html(data.responseText); } }); } //--> </SCRIPT> <TITLE>たしざん</TITLE> </HEAD> <BODY> <form action="/ZendAdd5/Index/kotae" method="post"> <select name="add1" id="add1" onChange="henkou()"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> + <select name="add2" id="add2"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> = <?php echo $this->formSubmit('','Add'); ?> </form> </BODY> </HTML> |
■サーバー側(Zendを使用した場合)
Zendを使う場合、クライアントからの要求に対して、コントローラーとViewが最低でも必要になります。
○コントローラーについて
画面から呼ばれたコントローラーのActionに対して、値を取得して、それに対応するデータをDBから、本来取ってくるのですが、今回はそれは面どっちいので、DBアクセスしないで、値をそのままadd2にセットしちゃっています。
|
○画面部分
add2をセットしています。
|