Zend Framework入門（16）：
JavaScriptフレームワークDojoとの連携 - Zend_Dojo（前編）-

Zend Frameworkによる実践的なPHPアプリケーション開発 16

dojo.dataの作成と操作：Zend_Dojo_Data

　動的なウェブページを作成する際の醍醐味の一つに、動的なデータのやりとりが挙げられます。リストとして表示する内容をあらかじめ（静的）にページに埋め込んでおくのではなく、必要に応じてサーバから取得することで、ウェブページのデザインに柔軟性を持たせることができます。

　Dojo Toolkitの一部であるDigitには、サーバとデータのやり取りを行う機能を持つものがあります。このデータのやり取りを行う際に利用するのがDojo Toolkitのdojo.data形式です。Zend_Dojo_Dataクラスはdojo.data形式の情報を作成／操作するためのクラスです。ここでは、Zend_Dojo_Dataクラスを利用して、サーバからDigitへデータを送る方法について紹介します（なお、ここで取り上げたDigit以外での利用については次回取り上げる予定です）。

　では、まずデータを受け取る方のクライアント側の記述について見てみましょう。ここではDigitの一つであるコンボボックスを利用しています。コンボボックスは基本的にはリストなのですが、新規に値を入力することもできる点が通常のリストと異なります。

［リスト7］dojo.dataを利用するDigit（data.phtmlの一部）

...
   //コンボボックス
   $url = $this->url(array('action'=>'datapost'));
   echo $this->combobox('cbox',
                        'b',
                        //データの受け取りに関する設定（1）
                        array('store' => 'cboxStore',
                              'storeType' => 'dojo.data.ItemFileReadStore',
                              'storeParams' => array(
                               'url' => $url,
                               ),
                        //データのどの列を表示するか（2）
                              'searchAttr' => 'name'
                             )
                       );
...

　このうち「$this->combobox」の部分は次のようなHTMLとして出力されます。

［リスト8］ComboBoxがどのようなHTMLに変換されるか

<div dojoType="dojo.data.ItemFileReadStore"
     jsId="cboxStore"
     url="/index/datapost"></div> （1）
<input id="cbox"
       name="cbox"
       value="b"
       type="text"
       store="cboxStore"
       searchAttr="name"
       dojoType="dijit.form.ComboBox">（2）

　リスト7の（1）がリスト8の（1）に対応しており、サーバからデータをどのように受け取るかを指定しています。データを取得する方法にはいくかあるのですが、ここではURLを指定してJSON形式でデータを取得することにします。リスト7でのstoreType「dojo.data.ItemFileReadStore」はデータをURLを指定し取得することを、storeParamsのurlはそのURLをそれぞれ設定しています。

　リスト7の（2）では、取得したデータのどの部分を表示するかについてを指定しています。コンボボックスについての情報を指定しています。サーバから送られて来る情報はリストの各要素が入った配列のような形になっています。その各要素がさらに、複数の要素を持つ配列になっていると考えてください（例えばPHP風に書くとリスト9のようになります）。

［リスト9］コンボボックス が受け取るデータの例（PHPの配列風）

array(
 array('name'=>'a', 'label'=>'alpha'),
 array('name'=>'b', 'label'=>'beta')
)

　このうち、どの要素を表示に利用するかを指定しているのがsearchAttrだと考えてください。ここではsearchAttrに「name」を指定していますので、コンボボックスの要素としては「a」と「b」があることになります。

　リスト8の（1）と（2）とを関連づけているのがリスト7（1）のstoreオプションで、リスト8（1）のjsId、（2）のstoreの値を指定しています。描画の際の手順としては、リスト8の（2）のComboBoxがまず描画され、必要に応じてComboBoxのstoreの値からリスト8の（1）を利用して情報をサーバから取得するようになっています。

　では、実際にやりとりされるデータはどのような形になっているのでしょうか？ このコンボボックスで利用されるデータはリスト10のようなJSON形式でやりとりされることになっています。

［リスト10］コンボボックス が受け取るデータの例（JSON形式）

{"identifier":"name",
 "items":[
  {"name":"a","label":"alpha"},
  {"name":"b","label":"beta"}
 ]
}

　さて、このデータを作成するのにZend_Dojo_Dataを利用します。サーバ側のデータを送る流れは（1）データの作成、（2）jsonに変換／クライアントへの送信、となります。

［リスト11］Zend_Dojo_Dataの作成方法（IndexController.php）

class IndexController extends Zend_Controller_Action
{
...
    public function datapostAction()
    {
        //識別用IDを指定して、Zend_Dojo_Dataを作成 (1)
        $data = new Zend_Dojo_Data('name');

        //データの追加 (2)
        $data->addItem(array('name'=>'a', 'label'=>'alpha'));
        $data->addItem(array('name'=>'b', 'label'=>'beta'));


        //ビュースクリプトへの受け渡し
        $this->view->assign('data', $data);
    }
...

　まずリスト11の（1）のようにコンストラクタでZend_Dojo_Dataのインスタンスを作成し、必要に応じて（2）のように情報の追加を行います。このように作成したZend_Dojo_Dataを出力します（リスト12）。

［リスト12］Zend_Dojo_Dataの出力（datapost.phtml）

<?php
echo $this->data->toJson();

　これを利用した結果は図2のようになります。

図2：Zend_Dojo_Dataを使った例

　ここでZend_Dojo_Dataの主なメソッドを紹介します：

Zend_Dojo_Dataの主なメソッド

メソッド名	引数	説明
（コンストラクタ）	$identifier, $items, $label	コンストラクタには識別用ID、データ、ラベルを引数として与えられる。引数はすべて省略可能で、省略時はnull。
addItem	$item, $id	データを登録する。$idは省略可能で、省略時はnull。
addItems	$items	複数のデータをまとめて登録する。
setIdentifier	$identifier	識別用IDを設定する。
setLabel	$label	ラベルを設定する。
setMetadata	$spec, $value	メタデータ$specの値を$valueに設定する。
fromArray	$data	配列から情報を登録する。
toArray	（なし）	格納されている情報を配列として返す。
fromJson	$json	JSON形式になっている情報からZend_Dojo_Dataを作成する。
toJson	（なし）	格納されている情報をJSON形式で返す。

　このうち、setMetadataはメタデータを設定する必要のあるDigitで利用するもので、利用するDigitの説明と共に取り上げます。

おわりに

　今回はDojo ToolkitとZend Frameworkの連携を行うZend_Dojoの基本的な使い方について説明しました。次回も引き続きZend_Dojoについて扱っていく予定です。Dojo Toolkitが提供する部品DigitをZend_Dojoから使う方法について説明していきます。