Webアプリ開発事始 第21回

XMLとプログラミング(2)
~JavaScriptによる検索処理の実例
長谷川裕行
有限会社 手國堂

業務アプリケーションでXMLを扱う場合、例えば取引先など外部のネットワークから受信したXML文書をデータベースのテーブルに変換し、アプリケーションからSQLを使ってデータベースを操作する――といった形になるのが、一般的でしょう。

しかし、シンプルなWebアプリケーションでは、テーブルのデータを記録したXML文書を直接HTML文書から操作する方が簡単です。

あまり複雑な処理には向いていませんが、単にデータを検索したり、簡単な分析を行うだけの場合には、データ変換の手間が省略できて効率的です。

JavaScriptを使ったデータ検索処理を紹介しましょう。


- はじめに -

プログラムのソースを事細かに解説することは、本記事の趣旨から外れてしまうのですが、XMLを操作する実例となると、どうしてもソースリストを掲載して内部の働きを解説する必要が出てきます。

今回は「パソコン部品のリストを記録したテーブル(XML文書)から、商品番号を入力してデータを検索する処理」のソースを示しながら、プログラミングでのXMLの扱いを紹介していくことにします。

作成するファイルは以下の3つです。
  mr_parts.xml:部品リストのXML文書
  items.html:ユーザーに提示するWebページ
  finditem.js:検索処理を記述したJavaScriptファイル


- 目次 -
部品リスト~mr_parts.xml(リスト1)
items.html~Webページ(リスト2)
画面のデザイン
JavaScriptの呼び出し
FORMタグによるユーザーインターフェイス
コマンドボタンの動作
finditem.js~検索処理のJavaScript(リスト3)
finditem~検索処理の本体(1)
finditem~検索処理の本体(2)
parse~XML文書の読み込み
searchItem~実際の検索処理(1)
searchItem~実際の検索処理(2)
searchItem~実際の検索処理(3)
searchItem~実際の検索処理(4)
makeList~検索結果の表示
スタイルシートのパターンマッチング
パターンマッチング
スタイルシートにスクリプトを書く
並べ替えのスクリプト
あとがき
長谷川 裕行 (はせがわ ひろゆき)
有限会社 手國堂 代表取締役   http://www.hirop.com/

テクニカルライターとして活躍。プログラミングに関する著書多数、DB Magazineなどにも多くの記事を提供している。

Copyright © GrapeCity inc. All rights reserved.