blob: 81cc8f5f5c1b7f7eed339bb281c2383a31dc2923 [file] [log] [blame]
//
// 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 受管 BeanFacelets 模板和复合组件)的向导。
下面的主题介绍了在 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"(视图)。随即会打开一个浏览器窗口,显示该模板。
[[faceletsTemplateClient]]
=== 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 FormJSF 窗体):*向页面添加以下代码片段。
[source,xml]
----
<f:view>
<h:form>
</h:form>
</f:view>
----
* *JSF Form From Entity(通过实体生成 JSF 窗体):*调用一个对话框,您可以在该对话框中将实体类中的数据与 JSF 窗体中的字段相关联。请参见<<form,为实体数据创建 JSF 窗体>>。
* *JSF Data TableJSF 数据表):*向页面添加以下代码片段。
[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+]