フレッシュマン企画連載
初めてでも安心！ 1日で作れるWebアプリ講座

第2回 Webサイトにどんどん機能を足してみよう！

では、さっそくXMLデータを使ってみましょう。まずは前回と同じようにVisual Web Developer 2008 Express Edition（以下、VWD 2008）を起動して、「新しいWebサイト」のプロジェクトを作成してください。今回もあらかじめコントロールを配置済みのWebページを準備してあります。

• Webページのダウンロード

　第1回と同様に、ダウンロードしたファイルを保存しましょう。保存するファイル（3点）は次のとおりです。

• imageフォルダ
• hirumeshi2.aspx
• hirumeshi2.aspx.cs

　ファイルを保存したら、［ソリューションエクスプローラ］を［最新の情報に更新］して、「hirumeshi2.aspx」と「hirumeshi2.aspx.cs」を開いてください。今回は、プロジェクトの新規作成時に自動生成される、「Default.aspx」および「Default.aspx.cs」は使用しません。［ソリューションエクスプローラ］内のファイル名を右クリックして［削除］しておきましょう。

　今回記述するのもPage_Load（＝ページ・ロード時）とButton_Click（＝ボタン・クリック時）の2つのイベントですが、第1回よりも記述する内容が多くなっていますので、じっくりと頑張りましょう。

　「hirumeshi2.aspx.cs」ファイルを開き、次の画面と同じになるように、Page_Loadのイベントの{ }内に のコードを記述してください。

Page_Loadのイベントに記述する内容1

コードのテキストはこちらからコピーできます。 「//」で始まる行はプログラムとして実行されないコメント文ですので記述しなくても構いません。 各番号については以下で説明します。

　このコードでは、使用するデータの準備をしています。

Labelコントロールに文字を表示させます。

（先ほどブラウザを通して見た）XMLを取得するためのURL情報を文字列の変数として用意します。ここではアクセスキーの部分が「{0}」と記述されている状態です。

ぐるなびにユーザー登録をして取得した各自のアクセスキーを用意します。

「String.Format()」とは、文字列を組み合わせて1つにする仕組みです。ここではとを組み合わせてURLを完成させる処理をしています。「String.Format()」については後ほど詳しく説明します。

　さらに、次の画面と同じになるように、Page_Loadのイベントの{ }内に（先ほどの「Page_Loadのイベントに記述する内容1」の のコードの下に） のコードを追記してください。

Page_Loadのイベントに記述する内容2

コードのテキストはこちらからコピーできます。

　ここではぐるなびからXMLを取得し、Dataset（データセット）という入れ物にセットしています。

で準備した2つのURLからXMLの内容を読み込んでいます。

Dataset型の入れ物を作ります。

作ったDataset型の入れ物にで読み込んだXMLの内容を入れます。

データセット？ 初耳だな。

データセットとは、メモリ上に一時的なデータベースを構築する“データ型”です。

　第1回で作成したstring型やint型は、1つの値を入れることができる入れ物でした。覚えていますか？

　Dataset型は1つの値だけでなく、下記のような表のデータを入れることができるのです。

　この表（都道府県の場合）でのデータセット（データセット名：Prefecture）の中身のイメージはこのような感じです。最上部は列名です。

pref_code	pref_name	area_code
PREF01	北海道	AREA150
PREF02	青森	AREA160
PREF03	岩手	AREA170
PREF04	宮城	AREA180
データセットの中身のイメージ（データセット名：Prefecture）
表の列項目にある「pref_code」は都道府県のコード番号、「pref_name」都道府県の名前、「area_code」は地域（東海、近畿など）のコード名を表しています。 〜は後の説明で使用する項目番号です。

　「http://api.gnavi.co.jp/ver1/PrefSearchAPI/?keyid=＜取得したアクセスキー＞」をブラウザで表示して、この表と見比べてみてください。確かにこの表と同じデータがXML形式で表示されるのが分かるでしょう。

　データセットについてもう少し詳しく理解してみましょう。

　データセットとは一時的なデータベースだと説明しましたが、まず、データベースとはどんなものでしょうか？ ここでは、データベースとは、上のような表の集まりだと考えてください。

　この表のことをTable（テーブル）といいます。Microsoft Accessなどのデータベース・ソフトでなじみのある人もいるかもしれません。また、テーブルの行のことをRow（ロウ）といいます。列のことをColumn（カラム）といいます。

　データセットにおける、特定のテーブル（表）の、特定のロウ（行）の、特定のカラム（列）を、コードで表現するには、次のような形式で記述します（ここでは見やすいように改行していますが実際には改行は不要です）。

　例えば、上の表の（Prefectureデータセットの「0」番目のテーブルの、「0」番目のロウの、「0」番目のカラム）をコードで表すには、

Prefecture.Tables[0].Rows[0][0]

と書きます。なお、「＜左から何番目のカラムか＞」の部分は「＜カラム名＞」で記述してもよく、その場合は次のようになります。

Prefecture.Tables[0].Rows[0]["pre_code"]

　このようにしてデータセットの中身を表します。

確かに、私たちの日常生活では、何かを数えるとき「1」から始める場合が多いですね。プログラミングの世界では「0」から始まるのです。データセットのイメージは下の図を参考にしてください（上記の「Prefecture」は、下の図の「Dataset」に該当します）。

データセットにおけるテーブル（Table）、ロウ（Row）、カラム（Column）の関係図

　0から始まる理由については諸説あり、こんな論議もされていますよ。

• 「0から始まるメリットは？」

ふーん。0から始まるのか。まぁ、そういうもんだと思っておくか。

　　　　あれ、嫌な気配がするなぁ……。うわ、ネモトサン！

（なんだ、そんなことか……。安心したよ。ちょろいー♪ ）

　ネモトサン、できました！ 見てください。

prefecture.Tables[0].Rows[0]["area_name"]
prefecture.Tables[0].Rows[0]["area_code"]
prefecture.Tables[0].Rows[1]["pref_code"]

はい、気を取り直して、次は、ドロップダウンリスト（DropDownList）コントロールで検索条件を選べるように設定してみましょう。

　次の画面と同じになるように、Page_Loadのイベントの{ }内に（先ほどの「Page_Loadのイベントに記述する内容2」の のコードの下に）のコードを追記してください。

Page_Loadのイベントに記述する内容3

コードのテキストはこちらからコピーできます。

　ここでは、 XMLで取得した情報（厳密には読み込んだXMLの内容を格納しているDataset型の入れ物）をDropDownListコントロールにセットして、ドロップダウンリストに表示する選択肢の項目名や、最初に表示するときに自動的に選択する値（＝初期値）などを設定しています。

-（1）XMLを読み込んで格納したデータセットを、ドロップダウンリストの選択肢としてまるごとセットする。
-（2）ドロップダウンリストの選択肢の項目名（使用者の目に見える）をセットする。
-（3）ドロップダウンリストの選択肢の値（使用者の目には見えない中身）をセットする。
-（4）ドロップダウンリストをバインドする（データをセットする最後の総仕上げのようなもの。詳しくは後述）。

の（1）〜（4）と同様の処理を行う。

ドロップダウンリストの初期値を設定する（これにより、表示時に初期値が選択されている状態になる）。

また聞きなれない言葉がでてきましたね。DataBind（データバインド）です。でも実は、よく使っている言葉なんです。書類をまとめるバインダをイメージしてください。

　たくさんの書類の中から必要な書類を選んだ後に、バインダにとじる作業と同じです。DataBindとは、DateSourceとして選んだデータセットの情報をコントロールに結び付ける処理です。選ぶ処理がDataSource、最終的にとじる処理がDataBindだと覚えましょう。

　さて、次はボタンをクリックしたときのイベントを記述します。