画像付き注文フォーム
■個人商店でのXMLの活用■
サンプル制作とスクリプト解説：こくあん和尚
四国の山あいの小さなうどん屋。めん処「きつね亭」の店主、鳴門貴恒（なるとたかつね）氏は悩んでいた。四万十川の支流の清らかな水で打った、手打ちうどんの味には自信があった。だが、人口1万人、高齢者の多い町では、来客は少なかった。
そんな鳴門氏に、客の老女が言った。「あんたんとこのうどんは、おいしいなあ。まいにち食べたいんじゃけど、足が悪うてよう来んけえ。出前をしてくれたら、ええがやけんど！」さっそく鳴門氏は、出前を試みた。ところが、耳の遠い老人たちの注文を、電話で受け付けるのは困難だった。
うどんを踏みながら鳴門氏は考え続け、そして、ひらめいた！「たしかホームページとやらでピザの宅配をやってると聞いたことがあるなあ」古来ひらめくのは騎上というが、うどんの上でもいいらしい。ふむふむ、なかなかいいアイデアだわい、とおもったものの、ところがどっこい、ホームページを作ろうとすると、CGIの壁が立ちはだかった。困った鳴門氏は、近所でパソコン塾を開いている、こくあん和尚を訪ねた。
相談を受けたこくあん和尚は、ハタ！と手を打った。
「鳴門さん、それなら、XMLを使ってみさい！Microsoft Internet Explorer5.0からサポートされたXML(eXtensive Markup Language)だったら、Webページに掲載されとるデータを自由に操れるんですよ！」
キツネにつままれたような顔の鳴門氏を尻目に、こくあん和尚は、年代ものの98に向かうと、猛然とキーを叩き始めた。
30分後。
「できたできた！メールに添付して鳴門さんのメールボックスに送っとくから、契約しているプロバイダさんのサーバに、アップロードしさいや」
何が何だか分からないまま、鳴門氏は、完成したデータとひきかえに、なぜか僧職のクセに草食ではないこくあん和尚に、肉うどんを馳走することを約束した。
さて、鳴門氏がファイルをアップロードしてみると、お年寄りの家族から、たくさんの注文が舞い込み始めた。いったいXMLで何ができるというのか？
◆「きつね亭」WebページのXMLの仕組み◆
はい！読者の皆さん、こくあん和尚です．．
和尚のクセに、牛肉タップリのうどんが好きで、しかもロン毛．．ははははは．．「きつね亭」のWebページは、誰でもカンタンにできてしまいます！これには「XML」を使っています。ご説明しましょう。
まず、「きつね亭」のWebページにアクセスしてみましょう。アクセスした先は、フォームが多用されている以外は、ごく普通のHTMLファイルです。
さっそくWebページに書かれている手順に従って、出前を注文してみてください。
＜お届け先＞欄に、氏名、住所、目印になる建物、電話番号を記入しましょう。
次にメニューを選びます。四万十川の水でつくった油揚げが店主の自慢と聞いているので、きつねうどんを一杯、注文してみましょうか。さらに、オプションの生姜めしを一人前注文．．．．．と。
[注文]ボタンを押すと、消費税を含めた合計金額が表示されます。これで、30分後には美味しいうどんが届きますよ。楽しみです。
ところで、XMLって、何かって？
ネットワークを使ってデータベースを扱うための方法、とでも言っておきましょうか。XMLのソースコードは一見、HTMLのようですが、自分でタグを自由に作れてしまうんですね。HTMLの拡張という側面もあります。つまり、HTMLでは、タグを使って内容を表示できますが、内容に意味を持たせることはできない、検索なんてできない。ところが、XMLでは、タグをキーにして検索したり集計したりソートしたりすることができます。タグで挟まれた内容が意味を持ってしまうわけです。HTMLの不可能を可能にするのがXMLっていうところでしょうか。ExcelやAccessのデータを有効利用できることが、いちばん身近なメリット．．．．．．といえるかな？？？
いろんなタグが氾濫すると、収集がつかなくなるので、業界全体でタグを決めてから運用するように言われていますが、「きつね亭」は、うどん業界（？）も何も、町に1軒しかないうどん屋なので、まぁ、よしとしましょう。
ここでは２つのXMLファイルを使ってます。「うどんの種類」(udon.xml)と「追加できる種類」(option.xml)の２つです。これらの中で使っている独自のタグに、ＤＯＭという何ともややこしそうな名前の方法を使って、アクセスしているんですねぇーー。ＤＯＭとはDocument Object Modelの略で、タグにアクセスする方法とでも考えておけばいいでしょう。難しく考えると精神衛生上よくないし、煩悩の源となりますので、極力カンタンに適当に考えてみましょう。仏に仕える立場の私が、煩悩の種を俗世に撒き散らすことは、めっそうもないことですもの....！！（爆笑）
例えば「天ぷらうどん」が食べたいなぁーーと思って「天ぷらうどん」の上でマウスをクリックすると、「うどんの種類」データを格納したXMLファイル(udon.xml)の<syurui>タグにアクセスして、「天ぷらうどん」に関する情報を取り出すことが出来るんです。いやいや、すごいじゃないですか！！よく言われることですが、人間長生きはするもんですな。私が１００才になった日にゃ、<臭い></臭い>で囲まれた内容の匂いまでもが、パソコンから流れてくるかも....！あららら...脱線しました。本題に戻りましょう、selectNodes(patternString)というＤＯＭを使って「天ぷらうどん」を検索させています。patternStringには検索方法を指定します。これがちょっとややこしい....。
先に「天ぷらうどん」のXMLデータを覗いてみましょう。
で１つのレコードです。各種うどんの種類がこのような形式でデータ化されています。
「天ぷらうどん」を検索して「具」の内容を取り出す条件の書き方は、次のように書きます。
udon_pattern="//kyssxml[syurui='" & kennsaku_udon & "']/gu"
udon_patternとkennsaku_udonnは変数です。kennsaku_udonnの変数には私の好きな「天ぷらうどん」という文字が格納されています。
上の書き方は次のように書いても同じです。
udon_pattern="//kyssxml[syurui='天ぷらうどん']/gu"
udon_patternに格納された検索条件を使って、その条件に適合するノード（節）にアクセスします。
set udon_node=kyss_udon.documentElement.selectNodes(udon_pattern)
udon_nodeは変数です。kyss_udonは「うどんの種類」をデータ化したXMLファイルに与えたID名です。<XML ID="kyss_udon" SRC="udon.xml">とHTMLファイルの中で記述している箇所のID名です。
これで変数udon_nodeに検索条件に一致した内容が格納されます。内容を取り出すには
kyss.udon_gu.value=udon_node(0).textと書きます。
kyss.udon_gu.valueは<INPUT TYPE="text" NAME="udon_gu">と指定したテキストボックスの値を表示させる領域です。先頭のkyssは<FORM NAME="kyss">で指定したフォーム名です。
udon_node(0).textの（０）は、今回は検索条件に一致するのは１データのみということが分かっていますので（０）になりますが、検索結果が複数有る場合は、この（０）に変数を使って順次取り出すこともできます。例えば
とすれば検索結果が順次ダイアログボックスに表示されます。
今回は１データですので
kyss.udon_gu.value=udon_node(0).textと書いています。
....という具合にＤＯＭを使うと、独自のタグに容易にアクセスできます...が..ＤＯＭを理解するのはなかなか大変ですよ。一つ一つ順を追って機会があるごと、実例に沿いながら解説して行きます。難しい解説は抜きにしてTry!XML and DOM!っていうことでしょうねぇーーー。
皆さんも、ぜひ！試してみてください。
では、またお会いしましょう。おそまつ！！
<原案・イラスト：薬師寺聖>