netbeans.apache.org/src/content/kb/docs/web/jsf20-support_ja.asciidoc

// 
//     Licensed to the Apache Software Foundation (ASF) under one
//     or more contributor license agreements.  See the NOTICE file
//     distributed with this work for additional information
//     regarding copyright ownership.  The ASF licenses this file
//     to you under the Apache License, Version 2.0 (the
//     "License"); you may not use this file except in compliance
//     with the License.  You may obtain a copy of the License at
// 
//       http://www.apache.org/licenses/LICENSE-2.0
// 
//     Unless required by applicable law or agreed to in writing,
//     software distributed under the License is distributed on an
//     "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
//     KIND, either express or implied.  See the License for the
//     specific language governing permissions and limitations
//     under the License.
//

= NetBeans IDEでのJSF 2.xのサポート
:jbake-type: tutorial
:jbake-tags: tutorials 
:jbake-status: published
:icons: font
:syntax: true
:source-highlighter: pygments
:toc: left
:toc-title:
:description: NetBeans IDEでのJSF 2.xのサポート - Apache NetBeans
:keywords: Apache NetBeans, Tutorials, NetBeans IDEでのJSF 2.xのサポート

image::images/netbeans-stamp-80-74-73.png[title="このページの内容は、NetBeans IDE 7.2、7.3、7.4および8.0に適用されます"]

NetBeans IDEは、JavaServer Faces (JSF) 2.0および2.1向けの組込みサポートを有効にする多数の機能を備えています。IDEのJSF 2.xサポートは、以前のJavaServer Faces向けのサポートに基づいて作成され、Faceletsページを対象とした多彩なエディタ拡張、エンティティ・クラスと連携するための様々な機能、およびJSF管理対象Bean、Faceletsテンプレートおよび合成コンポーネントの作成などの共通の開発タスク用の一連のJSFウィザードがあります。

以降の項では、NetBeans IDEでの作業中に自由に利用できるJSF 2.xの機能について説明します。新しいJSFの機能を試すには、Java WebテクノロジとJava EEテクノロジが含まれているlink:https://netbeans.org/downloads/index.html[+NetBeans IDEのJavaバンドル版をダウンロード+]します。このダウンロード・バンドルには、Java EE 6プラットフォーム仕様(JSR 316)のリファレンス実装であるGlassFish Server Open Source Editionも含まれています。


[[support]]
== プロジェクトのJSF 2.xサポート

プロジェクト用のJSFサポートは、次のように特徴付けることができます。

* プロジェクトにFaceletsテンプレート・ファイルが含まれる
* JSF 2.xライブラリがプロジェクトのクラスパスに追加される
* Facesサーブレットおよびサーブレットのマッピングがプロジェクトのデプロイメント・ディスクリプタに追加される

GlassFishサーバーまたは他の任意のJava EE準拠のサーバーを使用すると、JSF 2. xサポートを含むプロジェクトを作成したり、既存のプロジェクトにJSF 2.xのサポートを追加できます。

* <<creatingSupport,JSF 2.xサポートを含む新しいプロジェクトの作成>>
* <<addingSupport,既存のプロジェクトへのJSF 2.xサポートの追加>>


[[creatingSupport]]
=== JSF 2.xサポートを含む新しいプロジェクトの作成

新しいJava Webアプリケーションを作成するには、IDEのプロジェクト・ウィザードを使用します。そのためには、IDEのメイン・ツールバーにある「新規プロジェクト」(image:images/new-project-btn.png[])ボタンをクリックするか、[Ctrl]-[Shift]-[N] (Macの場合は[⌘]-[Shift]-[N])を押します。「ステップ4: フレームワーク」で、「JavaServer Faces」を選択します。

image::images/new-proj-wizard-framework.png[title="プロジェクト作成時のJSFフレームワーク・サポートの追加"]

JavaServer Facesを選択すると、上のイメージに示すように、様々な構成オプションを使用できるようになります。プロジェクトからJSF 2.xライブラリにアクセスする方法を決定できます。「構成」タブをクリックすると、Facesサーブレットをプロジェクトのデプロイメント・ディスクリプタに登録する方法を指定できます。

image::images/jsf-configuration.png[title="「構成」タブでのFacesサーブレットの設定の指定"]


[[addingSupport]]
=== 既存のプロジェクトへのJSF 2.xサポートの追加

既存のJava WebアプリケーションにJSF 2.xサポートを追加する場合は、プロジェクトの「プロパティ」ウィンドウから行えます。

1. 「プロジェクト」ウィンドウ([Ctrl]-[1]、Macの場合は[⌘]-[1])で、プロジェクト・ノードを右クリックし、「プロパティ」を選択します。「プロジェクト・プロパティ」ウィンドウが表示されます。
2. 「フレームワーク」カテゴリを選択し、「追加」ボタンをクリックします。
3. 「フレームワークの追加」ダイアログ・ボックスで、「JavaServer Faces」を選択します。「OK」をクリックします。

image::images/add-framework.png[title="既存のプロジェクトへのJSFサポートの追加"]

JavaServer Facesを選択すると、JSF 2.xライブラリへのパスの指定や、プロジェクトのデプロイメント・ディスクリプタでのFacesサーブレットの登録など、様々な構成オプションを使用できるようになります。



[[editor]]
== エディタの使用

IDEのエディタは言語固有であり、作業中のファイル・タイプに応じたサポートを提供します。一般的に、ファイル内の要素上で[Ctrl]-[Space]を押すと、コード補完とAPIドキュメントを呼び出すことができます。キーボード・ショートカットとコード・テンプレートを利用することもできます。

IDEのメイン・メニューから「ヘルプ」>「キーボード・ショートカット・カード」を選択して、よく使用するキーボード・ショートカットおよびコード・テンプレートを表示します。完全な一覧については、link:http://wiki.netbeans.org/KeymapProfileFor60[+NetBeans IDE 6.xキーボード・ショートカットの仕様+]を参照してください。

IDEは、link:http://javaserverfaces.java.net/nonav/docs/2.0/javadocs/index.html[+JSF 2.0 API+]およびlink:http://javaserverfaces.java.net/nonav/docs/2.1/javadocs/index.html[+JSF 2.1 API+]用の組込みのJavadocサポートに加え、JSFのlink:http://javaserverfaces.java.net/nonav/docs/2.1/vdldocs/facelets/index.html[+タグ・ライブラリ・ドキュメント+]を備えています。これらのリソースを実際の操作で利用するには、エディタ内の指定した要素上で単純に[Ctrl]-[Space]を押します。

Javadocドキュメントにアクセスしたままにするには、IDEのJavadocウィンドウを開きます(「ウィンドウ」>「その他」>「Javadoc」)。Javadocウィンドウは、エディタ内のカーソルの位置に応じて自動的に最新状態にリフレッシュされます。

JSFプロジェクトを操作する場合、編集作業は主としてFaceletsファイル、JSF管理対象BeanおよびFaces構成ファイル(`faces-config.xml`)に対して行われます。次に、自由に使用できるエディタのサポートを簡単に説明します。

* <<facelets,Faceletsエディタ>>
* <<xml,Faces XML構成エディタ>>


[[facelets]]
=== Faceletsエディタ

IDEのFaceletsエディタには、構文の強調表示、エラーやJSFタグのチェック、ドキュメントのサポート、およびEL式、Faceletsコア・ライブラリ、名前空間でのコード補完など、JSF開発を容易に行うための機能が多数用意されています。

必要に応じて[Ctrl]-[Space]を押し、コード補完およびドキュメントのサポートを呼び出すことができます。

image::images/doc-support.png[title="[Ctrl]-[Space]の押下によるコード補完とドキュメント・サポートの呼出し"]

カーソルがタグ上に置かれていないときに[Ctrl]-[Space]を押すと、項目のポップアップ・リストが呼び出されます。これらの項目は、IDEの「<<palette,パレット>>」([Ctrl]-[Shift]-[8]、Macの場合は[⌘]-[Shift]-[8])からもアクセスできます。

また、[Ctrl]-[Space]を押す前に接頭辞(`jsf`など)を入力して、項目をフィルタすることもできます。

image::images/code-completion.png[title="エディタでの[Ctrl]-[Space]の押下による項目のリストの呼出し"]

[Ctrl]-[Space]を押してFacelets名前空間のコード補完を呼び出します。

image::images/namespace.png[title="[Ctrl]-[Space]の押下によるFacelets名前空間の完成"]

同様に、ページでまだ宣言されていない名前空間を持つJSFタグを入力すると、ページの`<html>`タグに自動的に追加されます。

エディタは、式言語(EL)構文の補完サポートを備えています。暗黙オブジェクト、JSF管理対象Bean、およびそのプロパティに対する候補を呼び出すには、ELコードで[Ctrl]-[Space]を押します。

image::images/el-code-completion.png[title="EL式での[Ctrl]-[Space]の押下による、暗黙オブジェクト、JSF管理対象BeanおよびBeanのプロパティに対する補完サポートの呼出し"]

エディタでコード・スニペットを強調表示し、「合成コンポーネントに変換」を選択して、JSF合成コンポーネントを作成することもできます。詳細は、<<composite,合成コンポーネント・ウィザード>>を参照してください。

エディタは、基本的なエラー・チェック機能を備えています。エラーは赤い下線付きで表示され、対応するバッジが左マージンに表示されます。警告には黄色い下線が引かれ、左マージンに黄色いバッジが示されます。バッジまたは下線の付いたテキストの上にマウスを置くと、エラーの説明が表示されます。

JSFタグを入力すると、様々なチェックが実行されます。これらには次のものが含まれます。

* 宣言されたライブラリが存在するかどうか
* タグの接頭辞と一致するライブラリに、そのコンポーネントまたはタグが含まれているかどうか
* 必要なすべての属性がタグに含まれているかどうか
* 入力されたすべての属性がコンポーネントのインタフェースで定義されているかどうか

エディタは次についてもチェックします。

* 宣言されていないコンポーネントがあるかどうか
* 使用状況のないtaglib宣言があるかどうか


[[xml]]
=== Faces XML構成エディタ

JSFプロジェクトに`faces-config.xml`ファイルを含めると、ナビゲーション・ルールを定義するとき、または管理対象Beanを宣言するときに、[Ctrl]-[Space]を押して、コード補完とドキュメントのサポートを呼び出すことができます。

手動によるコーディングではなく、ダイアログを使用してナビゲーション・ルールおよび管理対象Beanを入力する場合は、この目的のためにIDEに用意されているいくつかのJSF固有のダイアログがあります。これらのダイアログには、エディタの右クリック・メニューからアクセスできます。

image::images/faces-config-menu.png[title="faces-config.xmlの右クリック・メニューで表示されるJSF固有のダイアログ"]

IDEには、`faces-config.xml`用の2つの異なる_ビュー_があります。1つはXMLソース・コードを表示するソース・ビューです。もう1つはページ・フロー・ビューで、これは`faces-config.xml`ファイルで定義されたJSFナビゲーション・ルールを表すグラフィカル・インタフェースです。

たとえば、ファイルに次のナビゲーション・ルールがあるとします。


[source,xml]
----

<navigation-rule>
    <from-view-id>/greeting.xhtml</from-view-id>
    <navigation-case>
        <from-outcome>response</from-outcome>
        <to-view-id>/success.xhtml</to-view-id>
    </navigation-case>
</navigation-rule>
----

「ページ・フロー」ビューには、次の関係が表示されます。これは、「`response`」がJSFの`NavigationHandler`に渡されると、`greeting.xhtml`から`success.xhtml`に移動することを示します。

image::images/page-flow.png[title="ナビゲーションの関係が表示された「ページ・フロー」ビュー"]

「ページ・フロー」ビュー内のコンポーネントをダブルクリックすると、ソース・ファイルに直接移動できます。たとえば、`greeting.xhtml`コンポーネントをダブルクリックすると、エディタで`greeting.xhtml`ファイルが開かれます。同様に、2つのコンポーネントの間にある矢印をダブルクリックすると、エディタで、`faces-config.xml` XMLビューで定義されたナビゲーション・ルールがフォーカスされます。



[[wizard]]
== JSFのウィザード

NetBeans IDEには、JSF 2.xを使用した開発に役立つ多数のウィザードが用意されています。新しいFaceletsページ、Faceletsテンプレート、JSF管理対象Bean、合成コンポーネント、Faces構成ファイルなどを作成できます。

すべてのウィザードは、IDEの一般的なファイル・ウィザードを経由してアクセスできます。ファイル・ウィザードにアクセスするには、「新規ファイル」(image:images/new-file-btn.png[])ボタンを押すか、メイン・メニューから「ファイル」>「新規ファイル」を選択します(または[Ctrl]-[N]、Macの場合は[⌘]-[N]を押します)。JSF固有のウィザードはJavaServer Facesカテゴリに一覧表示されます。

image::images/file-wizard.png[title="ファイル・ウィザードからJSF指向のウィザードにアクセス可能"]

JSFサポートを使用してJava Webプロジェクトを操作している場合は、次のウィザードを使用できます。

* <<jsfPage,JSFページ・ウィザード>>
* <<managedBean,JSF管理対象Beanウィザード>>
* <<facesConfig,Faces構成ウィザード>>
* <<composite,合成コンポーネント・ウィザード>>
* <<jsfPagesEntity,エンティティからのJSFページ・クラス・ウィザード>>
* <<faceletsTemplate,Faceletsテンプレート・ウィザード>>
* <<faceletsTemplateClient,Faceletsテンプレート・クライアント・ウィザード>>


[[jsfPage]]
=== JSFページ・ウィザード

プロジェクト用にFaceletsおよびJSPページを作成するには、JSFページ・ウィザードを使用します。IDEのファイル・ウィザードで、「JavaServer Faces」カテゴリを選択し、「JSFページ」を選択します。JSF 2.xでは、JSFページを宣言する方法としてFaceletsが優先されます。デフォルトで、ウィザードの「Facelets」オプションが選択されています。新しいJSPページまたはJSPフラグメント(`.jspf`ファイル)を作成する場合は、「JSPファイル」オプションを選択します。

image::images/jsf-file-wizard.png[title="IDEのJSFファイル・ウィザードを使用したFaceletsページの作成"]


[[managedBean]]
=== 管理対象Beanウィザード

IDEの管理対象Beanウィザードを使用して、アプリケーション用のJSF管理対象Beanを作成できます。IDEの<<fileWizard,ファイル・ウィザード>>の「JavaServer Faces」カテゴリから「JSF管理対象Bean」を選択します。

デフォルトでは、ウィザードで指定するメタデータは、注釈内に変換されます。この注釈は、管理対象Beanが生成されると、これらのBeanに適用されます。たとえば、次のイメージでは、`NewJSFManagedBean`という名前のセッション・スコープされたクラスを新しく作成し、これに`myManagedBean`という名前を付けています。

image::images/managed-bean.png[title="IDEの管理対象Beanウィザードを使用した、JSF管理対象Beanの作成"]

管理対象Beanが生成されると、次のように適切な注釈とともに表示されます。


[source,java]
----

package my.org;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;

*@ManagedBean(name="myManagedBean")*
*@SessionScoped*
public class NewJSFManagedBean {

    /** Creates a new instance of NewJSFManagedBean */
    public NewJSFManagedBean() {
    }

}
----

プロジェクトにすでに`faces-config.xml`ファイルが含まれている場合は、ウィザードの「構成ファイルにデータを追加」オプションがアクティブになり、Faces構成ファイルで管理対象Beanを宣言するか、管理対象Beanに注釈を経由して指定したメタデータを持つことができます。


[[facesConfig]]
=== Faces構成ウィザード

JSF 2.xでは、アプリケーションを構成するための標準のFaces構成ファイル(`faces-config.xml`)の代替手段として注釈が採用されています。したがって、プロジェクトにJSF 2.xサポートを追加しても、IDEではデフォルトの`faces-config.xml`ファイルは生成_されません_ (JSF 1.2では生成されました)。通常は、特定の構成設定を定義するために、`faces-config.xml`ファイルをプロジェクトに追加します。これを行うには、IDEのFaces構成ウィザードを使用します。

IDEの<<fileWizard,ファイル・ウィザード>>にある「JavaServer Faces」カテゴリから「JSF Faces構成」を選択します。これにより、新しい`faces-config.xml`ファイルが作成され、デフォルトでプロジェクトの`WEB-INF`フォルダに配置されます。

`faces-config.xml`向けのIDEのエディタ・サポートの説明については、<<xml,Faces XML構成エディタ>>を参照してください。


[[composite]]
=== 合成コンポーネント・ウィザード

JSF 2.xでは、ユーザー・インタフェース(UI)の合成コンポーネントの作成プロセスが簡素化されており、これらのコンポーネントをWebページで再利用できます。IDEの合成コンポーネント・ウィザードを使用すると、JSF合成コンポーネント用のFaceletsテンプレートを生成できます。

すべてのJSF関連ウィザードと同様に、合成コンポーネント・ウィザードには、IDEの<<fileWizard,ファイル・ウィザード>>にある「JavaServer Faces」カテゴリからアクセスできます。ただし、ウィザードをより直観的に表示するには、エディタのFaceletsページからコード・スニペットを強調表示し、ポップアップ・メニューから「リファクタリング」>「合成コンポーネントに変換」を選択します。

次の例では、スニペット「`<p>This is the composite component.</p>`」で合成コンポーネント・ウィザードを呼び出すときに発生するアクションと、自由に使用できる機能について説明します。

image::images/convert-comp-component.png[title="スニペットを強調表示した後の右クリック・メニューでの「合成コンポーネントに変換」の選択"]

合成コンポーネント・ウィザードが開きます。このとき、選択されたスニペットが「実装セクション」パネルに表示されます。

image::images/comp-component.png[title="選択されたコード・スニペットが表示された合成コンポーネント・ウィザード"]

デフォルトでは、合成コンポーネントを格納するための`ezcomp`フォルダが作成されます。たとえば、`myComponent`という名前の新しいコンポーネントを作成している場合、このウィザードにより`myComponent.xhtml` Faceletsページが生成され、アプリケーションのWebルートの`resources/ezcomp`フォルダに配置されます。

ウィザードを完了すると、指定したコード・スニペット用の合成コンポーネントのソース・ファイルが生成されます。テンプレートには、JSF 2.xの`composite`タグ・ライブラリへの参照が含まれます。


[source,html]
----

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
    *xmlns:cc="http://xmlns.jcp.org/jsf/composite"*>

  <!-- INTERFACE -->
  <cc:interface>
  </cc:interface>

  <!-- IMPLEMENTATION -->
  <cc:implementation>
    *<p>This is the composite component.</p>*
  </cc:implementation>
</html>
----

また、エディタ内で強調表示したスニペットの位置に、新しいコンポーネント・タグが挿入されます。この場合、生成されるタグは`<ez:myComponent/>`です。IDEでは、合成コンポーネントのある名前空間が、ページの`<html>`タグに自動的に挿入されます。

image::images/comp-component-editor.png[title="ページに自動的に挿入されたコンポーネント・タグ"]

IDEでは、合成コンポーネントのソース・ファイルへのハイパーリンク機能もサポートされます。コンポーネント・タグの上にマウスを置いているときに[Ctrl] (Macの場合は[⌘])を押すと、Faceletsページから合成コンポーネントに移動できます。ハイパーリンクをクリックすると、合成コンポーネントのソース・ファイルがエディタで開かれます。

JSF 2.xの合成コンポーネントの詳細は、link:http://blogs.oracle.com/enterprisetechtips/entry/true_abstraction_composite_ui_components[+真の抽象化: JSF 2.0の合成UIコンポーネント+]を参照してください。


[[jsfPagesEntity]]
=== エンティティからのJSFページ・クラス・ウィザード

<<entity,エンティティ・クラスのサポート>>の<<jsfPages,エンティティ・クラスからのJSFページの作成>>のトピックを参照してください。


[[faceletsTemplate]]
=== Faceletsテンプレート・ウィザード

Faceletsテンプレートを生成するには、Faceletsテンプレート・ウィザードを使用します。IDEの<<fileWizard,ファイル・ウィザード>>にある「JavaServer Faces」カテゴリから「Faceletsテンプレート」を選択します。8つの独自のレイアウト・スタイルから選択できます。また、レイアウトをCSSとHTML`<table>`タグのどちらを使用して実装するかを指定できます。

image::images/template-wizard.png[title="Faceletsテンプレート・ウィザードを使用したFaceletsテンプレートの作成"]

このウィザードにより、`<h:head>`タグと`<h:body>`タグを使用してXHTMLテンプレート・ファイルが作成され、関連付けられたスタイル・シートはアプリケーションのWebルートにある`resources/css`フォルダに保存されます。`default.css`ファイル、および選択するレイアウトに応じて`cssLayout.css`ファイルまたは`tableLayout.css`ファイルが生成されます。

ブラウザにテンプレートを表示するには、エディタ内で右クリックし、「表示」を選択します。ブラウザ・ウィンドウが開き、テンプレートが表示されます。


[[faceletsTemplateClient]]
=== Faceletsテンプレート・クライアント・ウィザード

プロジェクトのFaceletsテンプレートを参照するページを生成するには、Faceletsテンプレート・クライアント・ウィザードを使用します。IDEの<<fileWizard,ファイル・ウィザード>>にある「JavaServer Faces」カテゴリから「Faceletsテンプレート・クライアント」を選択します。クライアントで使用するFaceletsテンプレートの場所を指定できます。ルート・タグを ``<html>`` にするか ``<ui:composition>`` にするかを指定できます

image::images/new-template-client.png[title="Faceletsテンプレート・クライアント・ウィザードを使用した、Faceletsテンプレートのクライアントの作成"]

Faceletsテンプレートおよびクライアントの使用の詳細は、link:jsf20-intro.html[+NetBeans IDEでのJavaServer Faces 2.x入門+]のlink:jsf20-intro.html#template[+Faceletsテンプレートの適用+]の項を参照してください。



[[entity]]
== エンティティ・クラスのサポート

アプリケーションでJava Persistenceを使用しており、データベース・スキーマに基づいたエンティティ・クラスがある場合、IDEでは、エンティティ・クラス・データを使用した効率的な処理を可能にする機能が提供されます。

*注意: *データベース表からエンティティ・クラスを作成するには、データベース・ウィザードからIDEのエンティティ・クラスを使用します。これは、IDEの<<fileWizard,ファイル・ウィザード>>にある「持続性」カテゴリからアクセスできます。

* <<jsfPages,エンティティ・クラスからのJSFページの作成>>
* <<form,エンティティ・データ用のJSFフォームの作成>>
* <<dataTable,エンティティ・データ用のJSFデータ表の作成>>


[[jsfPages]]
=== エンティティ・クラスからのJSFページの作成

アプリケーションにエンティティ・クラスができたら、IDEのエンティティからのJSFページ・クラス・ウィザードを使用して、エンティティ・クラス・データを表示および変更するためのWebインタフェースを作成します。ウィザードで生成されるコードは、エンティティ・クラス内に格納された持続性注釈に基づいて生成されます。

ウィザードでは、エンティティ・クラスごとに次のものが生成されます。

* エンティティ・インスタンスの作成、取得、変更および除去のためのステートレス・セッションBean
* JSFセッション・スコープ指定管理対象Bean
* CRUD機能のための4つのFaceletsファイル(`Create.xhtml`、`Edit.xhtml`、`List.xhtml`、および`View.xhtml`)を格納するディレクトリ
* JSF管理対象Bean (`JsfUtil`、`PaginationHelper`)に使用されるユーティリティ・クラス
* ローカライズされたメッセージのプロパティ・バンドル、およびプロジェクトのFaces構成ファイル内(このファイルがない場合、`faces-config.xml`ファイルが作成される)の対応するエントリ
* レンダリングされるコンポーネントのデフォルトのスタイル・シートおよびFaceletsテンプレート・ファイルを含む、補助Webファイル

エンティティからのJSFページ・クラス・ウィザードを使用するには、<<fileWizard,IDEのファイル・ウィザードにアクセス>>します。「JavaServer Faces」カテゴリを選択し、「エンティティからのJSFページ・クラス」を選択します。

「ステップ3: 生成されたJSFページとクラス」に到達したら、生成するファイルの保存場所を指定できます。

image::images/jsf-entity-wizard.png[title="生成されるファイルの場所の指定"]

たとえば、ウィザードを`Customer`エンティティ・クラスに適用している場合、前出のイメージに示される設定によって次のファイルが生成されます。

|===
|image:images/projects-win-generated-files.png[title="新しく生成されたファイルが表示された「プロジェクト」ウィンドウ"] |

* プロパティのバンドルの場所を登録するための`faces-config.xml`ファイル。JSFビューのローカライズされたメッセージが格納されています。たとえば、ウィザードで「ローカリゼーション・バンドル名」に`/my/org/Bundle`を指定すると、次のエントリが生成されます。

[source,xml]
----

<application>
    <resource-bundle>
        <base-name>/my/org/Bundle</base-name>
        <var>bundle</var>
    </resource-bundle>
</application>
----
* Webルートの`customer`フォルダ。CRUD機能用の4つのFaceletsファイルが格納されています。
* `Create.xhtml`: 新しい顧客を作成するためのJSFフォーム。
* `Edit.xhtml`: 顧客を編集するためのJSFフォーム。
* `List.xhtml`: 顧客間をスクロールするためのJSFデータ表。
* `View.xhtml`: 顧客の詳細を表示するためのJSFフォーム。
* `jsfcrud.css`: JSFフォームとデータ表のレンダリングに使用されるスタイル・シート。
* `template.xhtml`: オプションのFaceletsテンプレート・ページ。生成された`jsfcrud.css`スタイル・シートへの参照が含まれます。
* `CustomerFacade`という名前が付いたステートレス・セッション(エンタープライズ) Bean。`my.org.data`パッケージにあります。このクラスには、プロジェクトの「エンタープライズBean」ノードからも同様にアクセスできます。
* `Bundle.properties`: JSFビュー用のデフォルトのローカライズ済メッセージを含むプロパティ・バンドル。
* `my.org.ui`パッケージにある`CustomerController`という名前の、JSFのセッション・スコープされた管理対象Bean。
* `my.org.ui.util`パッケージにある、2つのユーティリティ・クラス(`JsfUtil`および`PaginationHelper`)。これらは、`CustomerController`管理対象Beanによって使用されます。
 
|===


[[form]]
=== エンティティ・データ用のJSFフォームの作成

エンティティからのフォーム・ダイアログを使用して、エンティティ・クラスに含まれるすべてのプロパティのフィールドを含むJSFフォームを生成できます。フォームに関連付けられたユーザー・データを処理するために作成された、JSF管理対象Beanが用意されている必要があります。

*注意: *関連する管理対象Beanなしでこのダイアログを使用する場合は、管理対象Beanの名前をこのダイアログに入力できます。この名前は、有効かどうかにかかわらず、ページで使用されます。IDEの<<managedBean,管理対象Beanウィザード>>を使用して管理対象Beanを作成できます。または、<<jsfPages,エンティティからのJSFページ・クラス・ウィザード>>を使用すると、選択されたすべてのエンティティ・クラスに対する管理対象Beanが生成されます。

エンティティからのフォームのダイアログにアクセスするには、<<popup,Faceletsページのエディタで[Ctrl]-[Space]を押して>>「エンティティからのJSFフォーム」を選択するか、IDEの「<<palette,パレット>>」に一覧表示されているエンティティからのフォームの項目をダブルクリックします([Ctrl]-[Shift]-[8]、Macの場合は[⌘]-[Shift]-[8])。

たとえば、次のイメージでは、「`Customer`」エンティティ・クラスが、指定したプロジェクトの`my.org`パッケージにすでにあります。`customerController`管理対象Beanも、指定されたプロジェクトにすでに存在します。この管理対象Beanには、`Customer`オブジェクトを返す`selected`という名前のプロパティがあります。

image::images/jsf-form-from-entity.png[title="エンティティからのフォーム・ダイアログでの、エンティティ・データを使用したJSFフォームの生成"]

*注意: *読取り専用フィールドを含むフォームを作成するには、「読取り専用ビューを生成」オプションを選択します。このオプションが選択されると、IDEは`<h:outputText>`タグをフォーム・フィールドに適用します。このオプションが選択されない場合は、`<h:inputText>`タグが適用されます。

このダイアログを完了すると、IDEによりFaceletsページのコードが生成されます。たとえば、`customerId`プロパティを含む`Customer`エンティティ・クラスが次の形式で表示されます。


[source,xml]
----

<f:view>
    <h:form>
        <h1><h:outputText value="Create/Edit"/></h1>
        <h:panelGrid columns="2">
            <h:outputLabel value="CustomerId:" for="customerId" />
            <h:inputText id="customerId" value="#{customerController.selected.customerId}" title="CustomerId" required="true" requiredMessage="The CustomerId field is required."/>
            ...
            _[ Other fields added here. ]_
            ...
        </h:panelGrid>
    </h:form>
</f:view>
----

生成されたコードで使用されるテンプレートを変更するには、エンティティからのフォーム・ダイアログにある「テンプレートのカスタマイズ」リンクをクリックします。


[[dataTable]]
=== エンティティ・データ用のJSFデータ表の作成

エンティティからのデータ表ダイアログを使用して、エンティティ・クラスに含まれるすべてのプロパティ用の列を含むJSFデータ表を生成できます。この機能を利用するには、エンティティ・クラスに関連付けられたバックエンド・データを処理するために作成されたJSF管理対象Beanを用意しておく必要があります。

*注意: *関連する管理対象Beanなしでこのダイアログを使用する場合は、管理対象Beanの名前をこのダイアログに入力できます。この名前は、有効かどうかにかかわらず、ページで使用されます。IDEの<<managedBean,管理対象Beanウィザード>>を使用して管理対象Beanを作成できます。または、<<jsfPages,エンティティからのJSFページ・クラス・ウィザード>>を使用すると、選択されたすべてのエンティティ・クラスに対する管理対象Beanが生成されます。

エンティティからのデータ表ダイアログにアクセスするには、<<popup,Faceletsページのエディタで[Ctrl]-[Space]を押して>>「エンティティからのJSFデータ表」を選択するか、IDEの<<palette,パレット>>に一覧表示されているエンティティからのデータ表の項目をダブルクリックします([Ctrl]-[Shift]-[8]、Macの場合は[⌘]-[Shift]-[8])。

たとえば、次のイメージでは、指定したプロジェクトの`my.org.entity`パッケージに`Product`エンティティ・クラスがすでにあります。`productController`管理対象Beanもプロジェクト内にあり、管理対象Beanには、`Product`オブジェクトの`List`を返す`getProductItems()`という名前のメソッドが含まれています。

image::images/jsf-data-table-from-entity.png[title="エンティティからのデータ表ダイアログを使用した、エンティティ・データからのJSFデータの生成"]

このダイアログを完了すると、IDEによりFaceletsページのコードが生成されます。たとえば、`productId`プロパティを含む`Product`エンティティ・クラスが次の形式で表示されます。


[source,xml]
----

<f:view>
    <h:form>
        <h1><h:outputText value="List"/></h1>
        <h:dataTable value="#{productController.productItems}" var="item">
            <h:column>
                <f:facet name="header">
                    <h:outputText value="ProductId"/>
                </f:facet>
                <h:outputText value="#{item.productId}"/>
            </h:column>
            ...
            _[ Other columns added here. ]_
            ...
        </h:dataTable>
    </h:form>
</f:view>
----

生成されたコードで使用されるテンプレートを変更するには、データ表からのフォーム・ダイアログの「テンプレートのカスタマイズ」リンクをクリックします。



[[palette]]
== JSFパレットのコンポーネント

Faceletsページでの作業中、IDEの「パレット」を活用してJSFタグをページにドラッグ・アンド・ドロップできます。「パレット」にアクセスするには、メイン・メニューから「ウィンドウ」>「パレット」を選択するか、[Ctrl]-[Shift]-[8] (Macの場合は[⌘]-[Shift]-[8])を押します。

image::images/palette.png[title="IDEのパレットを使用した、「Facelets」ページへのJSFの一般的なコンポーネントのドラッグ・アンド・ドロップ"]

IDEのメイン・メニューから「ソース」>「コードを挿入」([Alt]-[Insert]、Macの場合は[Ctrl]-[I])を選択して、「パレット」内のJSF固有のコンポーネントを含むポップアップ・リストを呼び出すこともできます。

image::images/insert-code.png[title="エディタでの[Alt]-[Insert] (Macの場合は[Ctrl]-[I])の押下による、JSF固有のコンポーネント・リストの呼出し"]

「パレット」には、5つのJSF関連コンポーネントがあります。

* *メタデータ: * JSFメタデータ・タグ内に名前と値のペアを追加するためのダイアログを呼び出します。たとえば、名前と値のペアとして「`myId`」と「`myValue`」を指定すると、次のコード・スニペットが作成されます。

[source,xml]
----

<f:metadata>
    <f:viewParam id='myId' value='myValue'/>
</f:metadata>
----
* *JSFフォーム: *次のコード・スニペットをページに追加します。

[source,xml]
----

<f:view>
    <h:form>
    </h:form>
</f:view>
----
* *エンティティからのJSFフォーム: *エンティティ・クラスのデータをJSFフォームに含まれるフィールドに関連付けるためのダイアログを呼び出します。<<form,エンティティ・データ用のJSFフォームの作成>>を参照してください。
* *JSFデータ表: *次のコード・スニペットをページに追加します。

[source,xml]
----

<f:view>
    <h:form>
        <h:dataTable value="#{}" var="item">
        </h:dataTable>
    </h:form>
</f:view>
----
* *エンティティからのJSFデータ表: *エンティティ・クラスのデータをJSFデータ表に含まれるフィールドに関連付けるためのダイアログを呼び出します。<<dataTable,エンティティ・データ用のJSFデータ表の作成>>を参照してください。
link:/about/contact_form.html?to=3&subject=Feedback:%20JSF%202.x%20Support%20in%20NetBeans%20IDE[+このチュートリアルに関するご意見をお寄せください+]



[[seealso]]
== 関連項目

JSF 2.xの詳細は、次のリソースを参照してください。


=== NetBeansの記事およびチュートリアル

* link:jsf20-intro.html[+NetBeans IDEでのJavaServer Faces 2.x入門+]
* link:jsf20-crud.html[+データベースからのJavaServer Faces 2.x CRUDアプリケーションの生成+]
* link:../../samples/scrum-toys.html[+Scrum Toys - JSF 2.0の完全版サンプル・アプリケーション+]
* link:../javaee/javaee-gettingstarted.html[+Java EEアプリケーションの開始+]
* link:../../trails/java-ee.html[+Java EEおよびJava Webの学習+]


=== 外部リソース

* link:http://www.oracle.com/technetwork/java/javaee/javaserverfaces-139869.html[+JavaServer Facesテクノロジ+] (公式ホーム・ページ)
* link:http://jcp.org/aboutJava/communityprocess/final/jsr314/index.html[+JSR 314 JavaServer Faces 2.0の仕様+]
* link:http://download.oracle.com/javaee/6/tutorial/doc/bnaph.html[+Java EE 6チュートリアル: 第5章 - JavaServer Facesテクノロジ+]
* link:http://javaserverfaces.java.net/[+GlassFishサーバー・プロジェクトMojarra+] (JSF 2.xの公式リファレンス実装)
* link:http://forums.oracle.com/forums/forum.jspa?forumID=982[+OTNディスカッション・フォーラム: JavaServer Faces+]
* link:http://www.jsfcentral.com/[+JSF Central+]


=== ブログ

* link:http://www.java.net/blogs/edburns/[+Ed Burns+]
* link:http://www.java.net/blogs/driscoll/[+Jim Driscoll+]