// 
//     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 模板和复合组件）的向导。

下面的主题介绍了在 NetBeans IDE 中工作时可以使用的 JSF 2.x 功能。要试用新增的 JSF 功能，请link:https://netbeans.org/downloads/index.html[+下载 NetBeans IDE 的 Java 包+]，其中包含 Java Web 和 Java EE 技术。下载的包中还包含 GlassFish Server Open Source Edition，它是 Java EE 6 平台规范 (JSR 316) 的引用实现。


[[support]]
== 项目的 JSF 2.x 支持

项目的 JSF 支持可以分为以下几类。

* 项目中包含 Facelets 模板文件
* 项目的类路径中添加了 JSF 2.x 库
* 项目的部署描述符中添加了 Faces Servlet 和 Servlet 映射

使用 GlassFish Server 或任何其他 Java EE 兼容的服务器，可以创建具有 JSF 2.x 支持的项目，或者将 JSF 2.x 支持添加到现有项目中。

* <<creatingSupport,创建具有 JSF 2.x 支持的新项目>>
* <<addingSupport,将 JSF 2.x 支持添加到现有项目中>>


[[creatingSupport]]
=== 创建具有 JSF 2.x 支持的新项目

使用 IDE 的项目向导，创建一个新的 Java Web 应用程序。为此，请单击 IDE 主工具栏中的 "New Project"（新建项目）(image::images/new-project-btn.png[]) 按钮，或者按 Ctrl-Shift-N（在 Mac 上按 ⌘-Shift-N）。到“步骤 4 ：Frameworks（框架）”时，请选择 "JavaServer Faces"。

image::images/new-proj-wizard-framework.png[title="创建项目时添加 JSF 框架支持"]

选择 "JavaServer Faces" 后，将会看到各种配置选项（如上图所示）。您可以决定项目访问 JSF 2.x 库的方式。单击 "Configuration"（配置）标签，在其中指定 Faces Servlet 在项目的部署描述符中的注册方式。

image::images/jsf-configuration.png[title="在 "Configuration"（配置）标签下指定 Faces servlet 设置"]


[[addingSupport]]
=== 将 JSF 2.x 支持添加到现有项目中

如果要将 JSF 2.x 支持添加到现有 Java Web 应用程序中，可以通过项目的 "Properties"（属性）窗口来完成此操作。

1. 在 "Projects"（项目）窗口（Ctrl-1 组合键；在 Mac 上为 ⌘-1 组合键）中，右键单击项目节点，然后选择 "Properties"（属性）。将显示 "Project Properties"（项目属性）窗口。
2. 选择 "Frameworks"（框架）类别，然后单击 "Add"（添加）按钮。
3. 在 "Add a Framework"（添加框架）对话框中选择 "JavaServer Faces"。单击 "OK"（确定）。
image::images/add-framework.png[title="将 JSF 支持添加到现有项目"]

选择 "JavaServer Faces" 后，将会看到各种配置选项，例如指定 JSF 2.x 库的路径以及 Faces servlet 在项目的部署描述符中的注册。


[[editor]]
== 使用编辑器

IDE 的编辑器是特定于语言的，并根据您所使用的文件类型来提供支持。一般而言，在文件中的某个元素上，按 Ctrl-空格键可以调用代码完成和 API 文档。还可以利用快捷键和代码模板。

从 IDE 的主菜单中选择 "Help"（帮助）> "Keyboard Shortcuts Card"（快捷键列表），可以查看常见的快捷键和代码模板。要查看完整的列表，请参见 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-空格键即可。

如果要不断地访问 Javadoc 文档，可以打开 IDE 的 Javadoc 窗口（"Window"（窗口）> "Other"（其他）> "Javadoc"）。Javadoc 窗口会根据光标在编辑器中的位置自动刷新。

在处理 JSF 项目时，编辑工作将主要集中于 Facelets 文件、JSF 受管 Bean 和 Faces 配置文件 (`faces-config.xml`)。以下简要说明了可以供您使用的编辑器支持。

* <<facelets,Facelets 编辑器>>
* <<xml,Faces XML 配置编辑器>>


[[facelets]]
=== Facelets 编辑器

IDE 的 Facelets 编辑器提供了大量有助于 JSF 开发的功能，其中包括 JSF 标记的语法突出显示和错误检查、文档支持、EL 表达式的代码完成、核心 Facelets 库和名称空间。

您可以在适用的场合按 Ctrl-空格键调用代码完成和文档支持。

image::images/doc-support.png[title="按 Ctrl-空格键调用代码完成和文档支持"]

当光标不在标记上时，按 Ctrl-空格键将调用一个弹出式项目列表。也可以从 IDE 的 <<palette,"Palette"（组件面板）>>（Ctrl-Shift-8 组合键；在 Mac 上为 ⌘-Shift-8 组合键）访问这些项目。

还可以在按 Ctrl-空格键之前，键入一个前缀（如 `jsf`）以对项目进行过滤。

image::images/code-completion.png[title="在编辑器中按 Ctrl-空格键调用项目列表"]

可以按 Ctrl-空格键调用 Facelets 名称空间的代码完成。

image::images/namespace.png[title="按 Ctrl-空格键完成 Facelets 名称空间"]

同样地，如果您键入的 JSF 标记的名称空间未在页面中进行声明，IDE 会自动将该标记添加到 `<html>` 标记中。

IDE 编辑器可以为表达式语言 (EL) 的语法提供完成支持。在 EL 代码上按 Ctrl-空格键，可以调用隐式对象、JSF 受管 Bean 及其属性的建议。

image::images/el-code-completion.png[title="在 EL 表达式上按 Ctrl-空格键调用对隐式对象、JSF 受管 Bean 和 Bean 属性的完成支持"]

还可以在编辑器中突出显示代码片段，然后选择 "Convert to Composite Component"（转换为复合组件）以创建 JSF 复合组件。有关详细信息，请参见<<composite,复合组件向导>>。

IDE 编辑器可以提供基本的错误检查功能。使用红色下划线显示错误，并且左旁注中显示相应的标记。警告是黄色下划线，并且左旁注中使用黄色标记来表示。将鼠标悬停在标记或带有下划线的文本上，可以查看错误的描述。

输入 JSF 标记时，会执行各种检查。这些检查包括：

* 声明的库是否存在
* 与标记前缀匹配的库是否包含组件或标记
* 标记是否包含所有所需的属性
* 所有输入的属性是否已在组件的接口中定义

编辑器还会检查：

* 是否存在未声明的组件
* 是否存在未使用的标记库声明


[[xml]]
=== Faces XML 配置编辑器

如果您的 JSF 项目包含 `faces-config.xml` 文件，则在定义导航规则或声明受管 Bean 时，您可以按 Ctrl-空格键以显示代码完成和文档支持。

如果要使用对话框输入导航规则和受管 Bean，而不手动对其进行编码，IDE 提供了多个 JSF 特定的对话框来实现此目的。可以通过编辑器的右键单击菜单来访问。

image::images/faces-config-menu.png[title="在 faces-config.xml 的右键单击菜单中提供的特定于 JSF 的对话框"]

IDE 为 `faces-config.xml` 文件提供了两种不同的_视图_："Source"（源）视图（显示 XML 源代码）和 "PageFlow"（页面流）视图（描述 `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>
----

"PageFlow"（页面流）视图显示以下关系，表示当 "`response`" 传递到 JSF 的 `NavigationHandler` 时，从 `greeting.xhtml` 到 `success.xhtml` 发生了一次导航。

image::images/page-flow.png[title=""PageFlow"（页面流）视图显示导航关系"]

双击 "PageFlow"（页面流）视图中的组件，可以直接导航至源文件。例如，在双击 `greeting.xhtml` 组件时，`greeting.xhtml` 文件在编辑器中打开。同样，如果双击两个组件之间的箭头，编辑器将聚焦于 `faces-config.xml` 的 XML 视图中定义的导航规则。


[[wizard]]
== JSF 向导

NetBeans IDE 提供了各种向导以便于使用 JSF 2.x 进行开发。您可以创建新的 Facelets 页、Facelets 模板、JSF 受管 Bean、复合组件、Faces 配置文件等。

所有向导都可以通过 IDE 的通用文件向导访问。要访问文件向导，请按 "New File"（新建文件）(image::images/new-file-btn.png[]) 按钮，或从主菜单中选择 "File"（文件）> "New File"（新建文件）（或按 Ctrl-N；在 Mac 上按 ⌘-N）。在 "JavaServer Faces" 类别中列出了特定于 JSF 的向导。

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 页向导

使用 JSF 页向导为您的项目创建 Facelets 和 JSP 页。在 IDE 的文件向导中，选择 "JavaServer Faces" 类别，然后选择“JSF 页”。在 JSF 2.x 中，Facelets 是声明 JSF 页的首选方式。在默认情况下，"Facelets" 选项在向导中处于选中状态。如果要创建新的 JSP 页或 JSP 片段（`.jspf` 文件），请选中 "JSP File"（JSP 文件）选项。

image::images/jsf-file-wizard.png[title="使用 IDE 的 JSF 文件向导创建 Facelets 页"]


[[managedBean]]
=== 受管 Bean 向导

可以使用 IDE 的受管 Bean 向导为应用程序创建 JSF 受管 Bean。从 IDE 的<<fileWizard,文件向导>>的 "JavaServer Faces" 类别中，选择 "JSF Managed Bean"（JSF 受管 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` 文件，则向导的 "Add data to configuration file"（向配置文件添加数据）选项将变为活动状态，您可以在 Faces 配置文件中声明受管 Bean，也可以通过受管 Bean 中的标注指定所有元数据。


[[facesConfig]]
=== “Faces 配置”向导

JSF 2.x 引入标注作为配置应用程序的标准 Faces 配置文件 (`faces-config.xml`) 的替代方案。因此，在向项目添加 JSF 2.x 支持时，IDE 就_不会_像 JSF 1.2 中一样生成默认的 `faces-config.xml` 文件。当然，您可能希望将 `faces-config.xml` 文件添加到项目中，以便定义某些配置设置。为此，请使用 IDE 的“Faces 配置”向导。

从 IDE 的<<fileWizard,文件向导>>的 "JavaServer Faces" 类别中，选择 "JSF Faces Configuration"（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 页的代码片段，然后从弹出菜单中选择 "Refactor"（重构）> "Convert to Composite Component"（转换为复合组件）。

以下示例说明了对代码片段 "`<p>This is the composite component.</p>`" 调用复合组件向导时发生的操作以及供您使用的功能。

image::images/convert-comp-component.png[title="突出显示代码片段，并从右键单击菜单中选择 "Convert to Composite Component"（转换为复合组件）"]

此时将打开复合组件向导，其中向导的 "Implementation Section"（实现部分）面板中包含所选的代码片段。

image::images/comp-component.png[title="显示复合组件向导，其中包含所选的代码片段"]

默认情况下，该向导会创建一个 `ezcomp` 文件夹来包含复合组件。例如，如果您创建了一个名为 `myComponent` 的新组件，则向导会生成一个 `myComponent.xhtml` Facelets 页，将其存放在应用程序的 Web 根目录的 `resources/ezcomp` 文件夹中。

完成该向导后，会为给定的代码片段生成复合组件源文件。模板包含了 JSF 2.x 的`复合`标记库的引用。


[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 Template"（Facelets 模板）。您可以选择八种不同的布局样式，并指定该布局是使用 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` 文件，具体取决于所选择的布局。

要在浏览器中查看模板，请右键单击编辑器，然后选择 "View"（视图）。随即会打开一个浏览器窗口，显示该模板。


[[faceletsTemplate]]
=== Facelets 模板客户端向导

使用 Facelets 模板客户端向导可生成页面，以便在项目中引用 Facelets 模板。从 IDE 的<<fileWizard,文件向导>>的 "JavaServer Faces" 类别中，选择 "Facelets Template Client"（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 持久性，并且您具有基于数据库方案的实体类，则 IDE 会为您提供有效使用实体类数据的功能。

*注：*要通过数据库表创建实体类，请使用 IDE 的 "Entity Classes from Database"（通过数据库生成实体类）向导（可以从 IDE 的<<fileWizard,文件向导>>的 "Persistence"（持久性）类别中访问）。

* <<jsfPages,通过实体类创建 JSF 页>>
* <<form,为实体数据创建 JSF 窗体>>
* <<dataTable,为实体数据创建 JSF 数据表>>


[[jsfPages]]
=== 通过实体类创建 JSF 页

如果您的应用程序中含有实体类，则可以使用 IDE 的“通过实体类创建 JSF 页”向导创建一个用于显示和修改实体类数据的 Web 界面。向导生成的代码将基于实体类中包含的持久性标注。

对于每个实体类，向导都会生成以下内容：

* 用于创建、检索、修改和删除实体实例的无状态会话 Bean
* JSF 会话范围的受管 Bean
* 包含 CRUD 功能的四个 Facelets 文件（`Create.xhtml`、`Edit.xhtml`、`List.xhtml` 和 `View.xhtml`）的目录
* JSF 受管 Bean 所使用的实用程序类（`JsfUtil` 和 `PaginationHelper`）
* 本地化消息的属性包，以及项目的 Faces 配置文件（如果不存在 `faces-config.xml` 文件，则会创建一个）中的相应条目
* 辅助 Web 文件（包含呈现的组件的默认样式表）和一个 Facelets 模板文件

要使用“通过实体类创建 JSF 页”向导，<<fileWizard,请访问 IDE 的文件向导>>。选择 "JavaServer Faces" 类别，然后选择 "JSF Pages from Entity Classes"（通过实体类创建 JSF 页）。

到“步骤 3："Generate JSF Pages and Classes"（生成 JSF 页和类）”时，您可以指定将要生成的文件的位置。

image::images/jsf-entity-wizard.png[title="指定将生成的文件的位置"]

例如，如果将该向导应用于 `Customer` 实体类，则上图中显示的设置将生成以下文件：

|===
|image::images/projects-win-generated-files.png[title=""Projects"（项目）窗口将显示新生成的文件"] |

* `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 功能的四个 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` 包中）。此类还可以通过项目的 "Enterprise Bean"（企业 Bean）节点访问。
* `Bundle.properties`：一种属性包，其中包含 JSF 视图的默认本地化消息。
* 一个名为 `CustomerController` 的 JSF 会话范围的、受管 Bean（位于 `my.org.ui` 包中）。
* 两个实用程序类（`JsfUtil` 和 `PaginationHelper`），位于 `my.org.ui.util` 包中。这些文件都由 `CustomerController` 受管 Bean 所使用。
 
|===


[[form]]
=== 为实体数据创建 JSF 窗体

可以使用通过实体生成窗体对话框，以生成包含实体类中所有属性字段的 JSF 窗体。必须先创建一个 JSF 受管 Bean，才能处理与该窗体关联的所有用户数据。

*注：*如果在没有关联的受管 Bean 的情况下使用此对话框，可以在该对话框中输入一个受管 Bean 的名称，这样无论该名称是否有效，页面中都将使用该名称。随后您可以使用 IDE 的<<managedBean,受管 Bean 向导>>创建一个受管 Bean，或者如果使用<<jsfPages,“通过实体类创建 JSF 页”向导>>，为所有选定的实体类生成受管 Bean。

可以通过两种方式访问通过实体生成窗体对话框：<<popup,在 Facelets 页的编辑器中按 Ctrl-空格键>>，然后选择 "JSF Form From Entity"（通过实体生成 JSF 窗体），或者双击 IDE 的 <<palette,"Palette"（组件面板）>>（Ctrl-Shift-8 组合键；在 Mac 上为 ⌘-Shift-8 组合键）中列出的通过实体生成窗体项。

例如，在下图中，给定项目的 `my.org` 包中已经存在了一个 `Customer` 实体类。同时，给定项目中也包含 `customerController` 受管 Bean，且该受管 Bean 包含名为 `selected` 的属性，该属性会返回一个 `Customer` 对象。

image::images/jsf-form-from-entity.png[title="使用 "Form from Entity"（通过实体生成窗体）对话框通过实体数据生成 JSF 窗体"]

*注：*选择 "Generate read only view"（生成只读视图）选项可以创建包含只读字段的窗体。选中此选项时，IDE 会为窗体字段应用 `<h:outputText>` 标记，而在没有选中此选项时应用的则是 `<h:inputText>` 标记。

完成此对话框之后，IDE 会为 Facelets 页生成代码。例如，`Customer` 实体类（包含 `customerId` 属性）将按以下格式显示：


[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>
----

要对生成的代码所使用的模板进行修改，请单击通过实体生成窗体对话框中的 "Customize Template"（定制模板）链接。


[[dataTable]]
=== 为实体数据创建 JSF 数据表

可以使用通过实体生成数据表对话框，生成包含实体类中所有属性列的 JSF 数据表。要使用此功能，您必须先创建一个 JSF 受管 Bean，才能处理所有与该实体类相关联的后端数据。

*注：*如果在没有关联的受管 Bean 的情况下使用此对话框，可以在该对话框中输入一个受管 Bean 的名称，这样无论该名称是否有效，页面中都将使用该名称。随后您可以使用 IDE 的<<managedBean,受管 Bean 向导>>创建一个受管 Bean，或者如果使用<<jsfPages,“通过实体类创建 JSF 页”向导>>，为所有选定的实体类生成受管 Bean。

可以通过两种方式访问通过实体生成数据表对话框：<<popup,在 Facelets 页的编辑器中按 Ctrl-空格键>>，然后选择“通过实体生成 JSF 数据表”，或者双击 IDE 的 <<palette,"Palette"（组件面板）>>（Ctrl-Shift-8 组合键；在 Mac 上为 ⌘-Shift-8 组合键）中列出的通过实体生成数据表项。

例如，在下图中，给定项目的 `my.org.entity` 包中已经存在了 `Product` 实体类。同时，该项目也包含了 `productController` 受管 Bean，且该受管 Bean 包含一个名为 `getProductItems()` 的方法，该方法会返回一个 `Product` 对象`列表`。

image::images/jsf-data-table-from-entity.png[title="使用 "Data Table from Entity"（通过实体生成数据表）对话框通过实体数据生成 JSF 数据表"]

完成此对话框之后，IDE 会为 Facelets 页生成代码。例如，`Product` 实体类（包含 `productId` 属性）将按以下格式显示：


[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>
----

要对生成的代码所使用的模板进行修改，请单击通过数据表生成窗体对话框中的 "Customize Template"（定制模板）链接。


[[palette]]
== JSF "Palette"（组件面板）组件

使用 Facelets 页时，可以使用 IDE 的 "Palette"（组件面板）向页面拖放 JSF 标记。您既可以从主菜单中选择 "Window"（窗口）> "Palette"（组件面板），也可以按 Ctrl-Shift-8 组合键（在 Mac 上为 ⌘-Shift-8 组合键）访问组件面板。

image::images/palette.png[title="使用 IDE 的 "Palette"（组件面板）将公用 JSF 组件拖放到 "Facelets" 页上"]

您还可以从 IDE 的主菜单中选择 "Source"（源）> "Insert Code"（插入代码）（Alt-Insert 组合键；在 Mac 上为 Ctrl-I 组合键），调用包含组件面板中特定于 JSF 组件的弹出式列表。

image::images/insert-code.png[title="在编辑器中，按 Alt-Insert（在 Mac 上按 Ctrl-I）调用 JSF 特定的组件列表"]

"Palette"（组件面板）提供了五种 JSF 相关的组件：

* *Metadata（元数据）：*调用一个对话框以在 JSF 元数据标记内添加名称-值对。例如，如果您指定 "`myId`" 和 "`myValue`" 作为名称-值对，则会产生以下代码片段：

[source,xml]
----

<f:metadata>
    <f:viewParam id='myId' value='myValue'/>
</f:metadata>
----
* *JSF Form（JSF 窗体）：*向页面添加以下代码片段。

[source,xml]
----

<f:view>
    <h:form>
    </h:form>
</f:view>
----
* *JSF Form From Entity（通过实体生成 JSF 窗体）：*调用一个对话框，您可以在该对话框中将实体类中的数据与 JSF 窗体中的字段相关联。请参见<<form,为实体数据创建 JSF 窗体>>。
* *JSF Data Table（JSF 数据表）：*向页面添加以下代码片段。

[source,xml]
----

<f:view>
    <h:form>
        <h:dataTable value="#{}" var="item">
        </h:dataTable>
    </h:form>
</f:view>
----
* *JSF Data Table from Entity（通过实体生成 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 玩具 - 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 Server 项目 Mojarra+]（JSF 2.x 的正式引用实现）
* link:http://forums.oracle.com/forums/forum.jspa?forumID=982[+OTN 论坛：JavaServer Faces+]
* link:http://www.jsfcentral.com/[+JSF 中心+]


=== 博客

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