TOP＞サーバ構築・運用＞ 製品一覧：グリッド表示
XMLDB入門
eXistではじめよう！使って覚えるXMLデータベース入門

第４回：Webアプリケーションを構築しよう！
著者：ウルシステムズ  大塚 庸史、柏原 宏充   2007/8/6
前のページ  1  2  3  4
製品一覧：グリッド表示

   Ext JSで用意されているグリッド「Ext.grid.Grid」は、表示するデータをデータソース「Ext.data.Store」として提供します。今回はデータソースに対して、上で作成したshow_list.xqlを設定します。「Ext.data.HttpProxy」はXML Http Request（XHR）を行うためのライブラリです。
//データストアの設定です
ds = new Ext.data.Store({
//URL:show_list.xqlへの接続を設定します
   proxy: new Ext.data.HttpProxy({url: 'show_list.xql'}),
   //XMLデータとのマッピングを設定します
   reader: new Ext.data.XmlReader({record: 'product'},
           [{name: 'id', mapping: 'id'},'name', 'price'])
});
<<中略>>
ds.load();


構成部品表示：ツリー表示

   Ext JSで用意されているツリー「Ext.tree.TreePanel」では、XML形式のデータを基に、個々のノードを作成する必要があります。グリッド表示の場合と同様に、HttpProxyに対して上で作成したparts_tree.xqlを指定します。

var p = new Ext.data.HttpProxy({url:url}); ← URLを指定します
<<中略>>
p.load(parms, {
read: function(response) {
      var doc = response.responseXML;
      tree.setRootNode(treeNodeFromXml(doc.documentElement || doc));
}
}, tree.render, tree);

   treeNodeFromXml関数は受け取ったXMLの階層構造に基づき、再帰呼び出しを行い個々のノードを作成します。
アプリケーションを動かそう

   では早速サンプルアプリケーションを動かしてみましょう。

   サンプルアプリケーションのZipファイルを展開した後で、eXistのサーバを起動させます。サーバが起動したら、Webブラウザから以下のULRにアクセスします。

http://localhost:8080/exist/xquery/thinkit_exist/index.html

   画面が表示されたでしょうか。

   ロードボタンをクリックすると、製品一覧が表示されます。一覧から製品を選択してダブルクリックすると、右側のツリー部分に選択した製品を構成している部品が階層構造で表示されます。
最後に

   これまで4回に渡って、XMLDBの現状、eXistのインストールとXQuery、eXistを使ったWebアプリケーション開発についての説明を行ってきました。

   サンプルアプリケーションの作成では、XMLの複雑なデータを扱うことができる特性やXQueryの記述性の高さ、Ajaxライブラリを使った効率的な開発をうまく組み合わせることができたと思います。一般的なRDB＋Javaアプリケーション開発とは異なるスピード感をお伝えできたでしょうか。

   今回の連載では触れることができませんでしたが、AdobeのFlexなどに代表されるRIA（Rich Internet Applications）とXMLDBの相性は高いといえます。Flex2.0では、言語レベル／コントロールレベルでXMLデータに対応しているため、XMLのURLをプロパティに指定するだけで、データのツリー表示、テーブル表示を実現することができます。

   XMLDBは実験段階の技術ではありません。更新系など標準化途上の分野もありますが、XMLの利用シーンが増えている今日、十分に利用可能なソリューションの1つです。Ajax、RIAや他の技術と組み合わせることで、さらに面白い使い方ができると思います。本連載をここまで読んでいただいた読者の皆さん、ぜひともXMLDBに挑戦してみてください。

参考文献

 XQuery 1.0: An XML Query Language
 http://www.w3.org/TR/xquery/

 XML Query Use Cases
 http://www.w3.org/TR/xquery-use-cases/

 Ext JS
 http://extjs.com/

 XQuery
by Priscilla Walmsley, March 2007
 http://www.oreilly.com/catalog/9780596006341/

 Declarative XML processing with XQuery: Re-evaluating the big picture
by Daniela Florescu
 http://www.webservicessummit.com/Trends/DeclarativeXMLwithXQuery.PDF

前のページ  1  2  3  4

ウルシステムズ株式会社 大塚 庸史
 著者プロフィール
ウルシステムズ株式会社  大塚 庸史
ウルシステムズ株式会社シニアコンサルタント。2003年より現職。以前よりスクリプト言語には大きな興味を寄せていたが、最近、JavaScript、Flexの柔らかさに開眼しつつある。XQueryは今年「来る」と確信しつつ日々奔走中。
ウルシステムズ株式会社 柏原 宏充
 著者プロフィール
ウルシステムズ株式会社  柏原 宏充
ウルシステムズ株式会社シニアコンサルタント。Web系開発の世界でRDBMSと触れあっていたところ、様々なことがあってXMLDBの世界へ。技術を文字にして伝え、文字を実装にして証明することを武器に、今日もお客様の課題解決に取り組んでいる。
INDEX
第4回：Webアプリケーションを構築しよう！
  eXistを使ってのWebアプリケーション構築
  作ってみよう！
  関数の作成と再帰呼び出し
製品一覧：グリッド表示