演習 1.2: データベースへの接続と Web ページ上でのデータの表示

この演習では、データベースに接続する方法と Web ページ上でデータ・レコードを表示する方法を学習します。関連レコード・リストを Web ページに追加する方法も学習します。

このチュートリアルの Web サイトは、JavaServer Faces コンポーネントを備えた動的 Web ページを使用してデータベースにアクセスし、情報をページ上に表示します。このチュートリアルでは、関連レコードおよび関連レコード・リストを使用してデータベース内のデータを表し、データ・テーブルや通常の HTML 表の形式でデータをページに表示できるようにします。これらのコンポーネントが Java™ アクセス Bean を使用します。

データ・アクセス Bean についてさらに学習したい方に

データ・アクセス Bean は、エンタープライズ Bean を表す Java Bean です。この Bean は、通常、JavaServer Pages (JSP) ファイル、サーブレット、または別のエンタープライズ Bean とインターフェースをとるエンタープライズ Bean を用いるクライアント・プログラムで使用されます。アクセス Bean を使用すれば、エンタープライズ Bean のライフ・サイクルを管理する複雑さから保護されます。言い換えれば、Java Bean のプログラムを作成する場合と同じくらいの容易さで、エンタープライズ Bean のプログラムを作成することができ、エンタープライズ Bean のクライアント・プログラムを簡素化して、全体の開発時間を削減できます。

JavaServer Faces および Faces コンポーネントについてさらに学習したい方に

JavaServer Faces は、サーバーで実行する動的 Web アプリケーションのためのユーザー・インターフェース (UI) のビルドを支援するテクノロジーです。 JavaServer Faces フレームワークは、サーバー要求全体にわたって UI 状態を管理し、クライアントが活動化するサーバー・サイド・イベントを開発するための単純なモデルを提供します。 JavaServer Faces は Model/View/Controller (MVC) フレームワークを基にしています。これは、JavaServer Faces の場合、コントローラーはサーブレットであり、モデルは JavaBeans™ で表現され、ビューはアプリケーション・コードをほとんど使用しないか、あるいは全く使用しない JavaServer Faces コンポーネントで構成されるということを意味しています。このモデルのゴールは、コンテンツをプレゼンテーションから分離することです。

Faces コンポーネントなどのツールは、ご使用の Web アプリケーションでのこのテクノロジーの使用を支援します。 Faces コンポーネントには、ページ内に JavaServer Faces インターフェースを表す JavaServer Page (JSP) カスタム・タグ・ライブラリーが組み込まれています。このウィザードは、Faces コンポーネントの使用を可能にする JSP ファイルの作成を支援します。 Faces コンポーネントにより、「パレット」ビューの Faces ドロワーからコンポーネントをドラッグして、作成中の Web ページにドロップすることによって、Web アプリケーションを開発することができます。

例えば、入力 1 行テキスト領域をドラッグして、ページ上のフォームにドロップできます。次に、「実行」ボタンをこの入力 1 行テキスト領域の横にドラッグ・アンド・ドロップできます。最後に、この入力 1 行力テキスト領域をユーザーのデータ・ソースに結合することができます。これで、エンド・ユーザーは Web アプリケーションからユーザーのデータ・ソースにデータを入力できるようになります。

さらに、Faces コンポーネントを使用してビルドされたアプリケーションには、その基礎であるプログラム・ロジックとは独立して、ユーザー・インターフェースをレンダリングできる利点があります。このことは、ユーザーのアプリケーションが、ブラウザーまたはハンドヘルド・デバイスなどのさまざまなプラットフォーム上で実行し、データにアクセスできることを意味しています。

関連レコード・リストの追加

この演習では、データベースにあるすべての案内広告を表示するための関連レコード・リストを作成します。次に、データベースに接続して、関連レコード・リストの中で必要とする情報を保持しているテーブルを選択します。最後に、この関連レコード・リストを、データ・テーブルのページに表示します。

関連レコードは、データベースの 1 つのレコードだけに接続します。このケースでは、1 つの関連レコードは、サンプル・データベースの単一案内広告を表します。関連レコードを使用すれば、新規レコードの作成、既存レコードの編集、または古いレコードの削除を行えます。
関連レコード・リストは、データベースの複数のレコードに接続します。このケースでは、関連レコード・リストはサンプル・データベースの 2 つからすべてまでの任意の数の案内広告を表示します。
データ・テーブルは、関連レコード・リストからデータをページに表示します。データ・テーブルは、単にレコード・リストの場所を指定するだけであり、HTML 表と同じようにデータを行と列にフォーマット設定するわけではありません。
データ・テーブルについてさらに学習したい方に
データ・テーブルは、関連レコード・リストのようなデータ・オブジェクトを保持する Faces JSP ページのコンポーネントです。データ・テーブルには HTML 表のように行と列があるように見えますが、これは HTML 表のようには機能しません。テーブル内と同様に入出力コントロールをフォーマットしたい場合は、パレットの拡張 Faces コンポーネント・ドロワーから、「パネル - グループ・ボックス」を使用します。この方法は『演習 2.2: データ・テーブルのフォーマット』に説明してあります。
データ・テーブルは、Faces コンポーネントであって、HTML コンポーネントではないので、「Page Designer」ビューではなく、「プロパティー」ビューでコントロールされます。「プロパティー」ビューを使用して、以下のようにデータ・テーブルをさまざまな方法でカスタマイズすることができます。
- 列順を追加、除去、および変更する
- テキストおよび背景をフォーマットする
- ヘッダー、フッター、および余白を追加する
- 結果を表示するページングを追加する

新規関連レコード・リストを作成するには、以下のとおりに実行します。

Web パースペクティブの「プロジェクト・エクスプローラー」ビューで、「ClassifiedsTutorial」 > 「WebContent」を展開する。
「WebContent」フォルダーで、「all_records.jsp」をダブルクリックする。エディターで、all_records.jsp ファイルが開きます。
デフォルトのテキスト「bodyarea のデフォルトのコンテンツ (Default content of bodyarea)」を削除する。
「パレット」ビューでデータ・ドロワーを展開する。
パレットから「関連レコード・リスト」コンポーネントをブランクのコンテンツ領域にドラッグする。「関連レコード・リストの追加」ウィンドウが開きます。
「名前」フィールドに「all_recordlist」と入力する。関連レコード・リストおよび関連レコード名は、変数名に関する Java 標準命名規則に準拠している必要があります (例えば、スペースを含むことはできません)。
「データ・コントロールの追加」が選択されていることを確認する。「データ・コントロールの追加」が選択されていれば、ウィザードによりデータ・テーブルが作成され、レコード・リストがページに表示されます。選択されていない場合、ウィザードはレコード・リストを作成するだけで、ページ上にそのデータは表示しません。ここでは、ウィザードにデフォルトのデータ・テーブルを作成させ、ユーザーは後からそれをカスタマイズします。「関連レコード・リストの追加」ウィンドウは、次のようになるはずです。

「次へ」をクリックする。
ウィザードの次のページにある「接続名」フィールドで、「新規」をクリックして新規データベース接続を作成する。「新規 JDBC 接続」ダイアログが開きます。「新規接続の作成」ラジオ・ボタンを選択し、「次へ」をクリックする。
「データベース・マネージャーの選択」リストで、「Derby」を展開し、次に「10.1」を選択する。
「データベース・ロケーション」フィールドで、「参照」をクリックし、「<workspace_location>¥ClassifiedsTutorial¥WebContent¥¥database」を選択する。ここで、「<workspace_location>」は現行ワークスペースのディレクトリーです。「OK」をクリックして、「フォルダーの参照」ウィンドウを閉じます。
「クラス・ロケーション」フィールドで、JDBC ドライバー・クラスを実装する JAR (複数可) のロケーションを入力するか、「参照」をクリックしてファイル・システムからロケーションを選択する。 JAR ファイルのロケーションを選択したら、「開く」をクリックします。
データベースにアクセスするには、ユーザー ID の入力が必要となる場合があります。パスワードは必要ありません。「新規データベース接続」ウィザードは、次のようになるはずです。
「新規 JDBC 接続」ウィザードで、「終了」をクリックする。「関連レコード・リストの追加」ウィザードに戻ります。
「プロジェクトのデータベース接続の構成」をクリックする。「JDBC 接続プロパティー (JDBC Connections properties)」ウィンドウが開きます。
「ランタイム接続の詳細」セクションの隣にある「編集」をクリックする。ランタイム接続のタイプとして「ドライバー・マネージャー接続の使用」を選択する。「終了」をクリックし、「OK」をクリックすると、「関連レコード・リストの追加」ダイアログに戻ります。 Derby データベースへの接続を作成したので、表示するテーブルまたはレコード・リストを選択する必要があります。「関連レコード・リストの追加」ウィザードには、データベースのテーブルが表示されます。
「W5SAMPLE」を展開し、「ADS」を選択する。「次へ」をクリックする。このウィザードの残りのページで、ユーザーのレコード・リストから列を除外して、拡張オプション (例えば、主キーの定義、他のテーブルへの関係の追加、フィルターおよびソート条件の指定) を実行することができます。これらのページについては、後続の課題でさらに学習します。
ダイアログの「関連レコードの追加」ページで、関連レコード・リストに組み込む列を指定する。「次へ」をクリックします。
このチュートリアルで表示すべき項目は、各案内広告のタイトル、説明、カテゴリー、価格、および電話番号のみです。デフォルトでは、すべての列が選択されています。以下を除くすべての列をクリックしてクリアし、表示を抑止します。
- MAINCATEGORY: String
- TITLE: String
- DESCRIPTION: String
- PRICE: BigDecimal
- PHONE: String
Web ページでのデータ・テーブル表示の編成を洗練させることができる。列を選択し、上矢印および下矢印をクリックして望ましい位置に再配列することができます。
列を次の順序に配置します。
- TITLE
- DESCRIPTION
- MAINCATEGORY
- PRICE
- PHONE
「終了」をクリックします。
Web ページは、次のように表示されるはずです。
このページを保管する。

次の演習では、このページが実際の Web サーバーでどのように表示されるかを確認します。データ・テーブルと JavaServer Faces コンポーネントをフォーマットするには多くのオプションがあります。これらのオプションの一部は、次のモジュールで取り上げています。ページ上の種々の JavaServer Faces コンポーネント (例えば、データ・テーブル、および個々の出力コンポーネント) について、独自に「プロパティー」ビューを調べてみることもできます。

演習のチェックポイント

演習 1.2 が完了しました。この演習では、データベースに接続する方法と、Web ページ上で関連レコード・リストを使用してデータ・レコードを表示する方法を学習しました。

< 前へ | 次へ >