TOPシステム開発> 情報入力ページの作成




まるごとサーバサイドJava
JDeveloperで学ぶJSF入門

第6回:情報入力ページの作成

著者:WINGSプロジェクト  佐藤治夫(株式会社ビープラウド)、
小泉守義

監修:山田祥寛   2006/8/8
1   2  次のページ
情報入力ページの作成

   ダイアグラムエディタでページアイコンをダブルクリックすると該当するJSF用JSPページを編集することができます(ここではinput.jspをダブルクリックします)。

   JSPページがまだ作成されていない場合は「Create JSF JSP - JSP File」ダイアログ(JSFJSPウィザード)が開きますが、ここではオプション設定の必要はないので、そのまま「終了」ボタンをクリックしてダイアログを閉じます。ダイアログを閉じると、HTML/JSPエディタが立ち上がるので、エディタ下部にある「JSPビューア」タブを選択し、ビジュアルエディタに切り替えます。

   さらに、「コンポーネント・パレット」の上部にあるプルダウンメニューから「JSF HTML」を選択すると、パレットにJSFのHTMLコンポーネントセットが現れるので、これをドラッグしてページ上に配置していきます。


パネルグリッドの配置

   まず、パレットから「Panel Grid」をドラッグして何もないワークスペース上に1つ配置します。一般的に、どのJSFページの編集にも言えることですが、JSFの仕様上、<h:panelGrid>コンポーネントを利用しないと不都合が生じることがあります(注1)。したがって、ここでは「おまじない」としてこれを配置し、この中にほかのコンポーネントを挿入していくことにします。

※注1: 具体的には<h:message>コンポーネントで、for属性にまだ出現していないコンポーネントのIDを指定できなくなるなどの問題があります。

   パネルグリッドは、格納する他のコンポーネントをcolumns属性で指定された列数だけ横並びに格納していくコンポーネントで、その正体はHTMLのテーブルです(図1)(注2)。

パネルグリッドとレイアウト枠
図1:パネルグリッドとレイアウト枠
(画像をクリックすると別ウィンドウに拡大図を表示します)

※注2: CSSの流行もあってか、一般にテーブルを使ったレイアウトは嫌われる傾向にありますが、JSFの標準コンポーネントではこれを避ける方法はないようです。どうしても嫌な方はカスタムコンポーネントの自作を検討しましょう。


表示テキスト(<h:outputText>コンポーネント)の挿入

   通常のテキスト表示を行う場所には、コンポーネントを使用します。パレットからドラッグして配置したのち「プロパティ・インスペクタ」でvalueプロパティを表示させたい文字列に書き換えます(図2)。

valueプロパティの変更
図2:valueプロパティの変更
(画像をクリックすると別ウィンドウに拡大図を表示します)

1   2  次のページ

書籍紹介
まるごとサーバサイドJava! Vol.1
まるごとサーバサイドJava! Vol.1 〜初心者からプロまですべての開発者に贈る〜サーバサイドJavaのすべてをまるごと紹介
サーバサイドで実行されるシステム環境Java EEを取り巻く環境は一大変革を遂げようとしています。J2EE時代のEJB(Enterprise Java Beans)からPOJO(Plain Old Java Object)へ、オブジェクト指向からアスペクト指向へ。Sun Microsystems外から発生した新しい流れは本家Java EE 5へ取り入れられる予定です。本書はこうしたJavaの新潮流を余すことなくお伝えします。

発売日:2006/09/01
定価:\2,415(本体 \2,300+税)
著者:WINGSプロジェクト 佐藤治夫(株式会社ビープラウド)、小泉守義 監修:山田祥寛
著者プロフィール
著者:WINGSプロジェクト 佐藤治夫(株式会社ビープラウド)、
小泉守義
監修:山田祥寛

WINGSプロジェクトは、有限会社WINGSプロジェクト(代表取締役山田祥寛)が運営するライティング・チーム。海外記事の翻訳から、主にサーバサイド分野の書籍/雑誌/Web記事の執筆、講演、アプリケーション開発などを幅広く手がける。2006年7月時点での登録メンバーは20名で、現在も一緒に執筆をできる有志を募集中。執筆に興味のある方は、どしどし応募いただきたい。


この記事の評価をお聞かせください
ボタンをクリックしますとウインドウが開きます。

INDEX
第6回:情報入力ページの作成
情報入力ページの作成
  パネルグループと入力テキストの配置
JDeveloperで学ぶJSF入門
第1回 JSFの特長
第2回 JSFを構成する要素
第3回 JSFのライフサイクルとStrutsとの比較
第4回 環境設定
第5回 JSFアプリケーションを作成しよう
第6回 情報入力ページの作成
第7回 コマンドボタンの配置と結果出力ページの作成
第8回 バリデータの設定とメッセージの日本語化
第9回 アプリケーションロジックを追加する
第10回 モデルとビューを統合する
第11回 バインディングとテスト
第12回 カスタムバリデータの作成方法〜JSFをより高度に利用するために
第13回 独自のバリデータタグの作成
第14回 カスタムコンバータの作成
第15回 カスタムコンポーネントの作成(前編)
第16回 カスタムコンポーネントの作成(後編)