FeaturesDocs & SupportCommunityBlogsPartners

Visual Web JSF 应用程序开发入门指南

本教程提供了在 NetBeans IDE 6.5 中开发 Visual Web JSF 应用程序的快速导览。它介绍了如何使用 Visual Web JSF 应用程序功能和 JavaServer Faces 1.2 (Woodstock) 组件来执行 Web 应用程序开发在各个典型阶段的工作。

由于本教程的设计使然，您不必按任何特定顺序进行学习。您可能想要快速浏览本教程，然后在时间允许的情况下回顾各个部分。如果您希望逐步学习本教程，则可能需要先尝试开发 JSF Web 应用程序。

预计时间：45 分钟

目录

本页上的内容适用 NetBeans IDE 6.5

 

要学习本教程，您需要具备以下软件和资源。

软件或资源 要求的版本
NetBeans IDE 6.5 Java 版本
Java Development Kit (JDK) 版本 6 或版本 5
JavaServer Faces 组件/
Java EE 平台		 1.2（带有 Java EE 5*）或
1.1（带有 J2EE 1.4）
GlassFish 应用服务器 V2
Travel 数据库 对于某些部分来说是必需的

* 要利用 NetBeans IDE 的 Java EE 5 功能，请使用完全符合 Java EE 5 规范的应用服务器，例如 GlassFish Application Server V2 UR2。如果使用的是其他服务器，请查阅发行说明和常见问题解答，了解已知问题和解决方法。有关支持的服务器和 Java EE 平台的详细信息，请参见发行说明。

创建项目

项目就相当于 Web 应用程序的工作环境。在创建 Visual Web JSF 应用程序项目时，如果在 NetBeans IDE 中将 GlassFish V2 或更高版本指定为应用服务器，则 IDE 可以基于使用 JavaServer Faces 1.2 组件的 Java EE 5 来创建 Web 应用程序。缺省情况下，将在符合 Web 应用程序的 Java BluePrints 项目约定的目录结构中创建 Web 应用程序。

 

试试看

  1. 按照下面列出的相应步骤启动 IDE：

    • Windows、Solaris 和 Linux。双击 NetBeans 桌面图标。
    • Mac。在 MacOS 上，可执行文件安装在 /Applications/ 目录中。双击该文件夹中的 NetBeans 图标。

  2. 创建一个 Visual Web JSF 应用程序项目：

    1. 从主菜单选择“文件”>“新建项目”选项。
    2. 在“新建项目”向导中，选择 "Java Web" 类别和“Web 应用程序”项目类型，然后单击“下一步”。
    3. 将该项目命名为 GettingStarted。请注意缺省项目位置。如果愿意，也可以浏览并选择其他位置。
    4. （可选）选中“使用专用文件夹存储库”复选框，并指定库文件夹的位置。有关此选项的详细信息，请参见共享项目库。
    5. 单击“下一步”。

    6. 选择服务器和 Java EE 版本。

      例如，缺省服务器为 GlassFish V2，缺省 Java EE 版本为 Java EE 5。
    7. 单击“下一步”。
    8. 在“框架”面板中，选择 "Visual Web JavaServer Faces" 框架。
    9. 单击“完成”以在缺省位置或在步骤 c 中选择的位置创建新项目。
  3. IDE 将在选定（或缺省）的项目文件夹中创建项目目录，并为其指定与项目相同的名称。

  4. 浏览“项目”窗口。正如下图所示，“项目”窗口按类别对各项进行分组。展开每个节点，可以查看每个类别中有哪些类型的项。

    突出显示 "Page1.jsp" 的“项目”窗口
  5. "Page1.jsp" 节点位于“Web 页”节点下。缺省情况下，IDE 会创建该页并将其作为起始页。节点旁边的箭头标记 起始页标记 用于将该页标识为起始页。如果要将其他页面作为起始页，请右键单击该页的节点，然后从弹出式菜单中选择“设置为起始页”。

  6. 单击“文件”标签，或者从主菜单中选择“窗口”>“文件”以将“文件”窗口置于前端。此窗口按各项的物理存储位置来组织它们。展开节点可查看其结构。请注意 ApplicationBean1.java 节点及其下面的几个其他节点（如 Page1.java）旁边显示的标记 未编译标记。该标记指示需要对文件进行编译。IDE 将在生成项目时自动编译这些文件。

    显示源文件的“文件”窗口
  7. 在上图中，请注意 "GettingStarted" > "src" > "java" > "gettingstarted" > "Page1.java" 节点。该 Java 类是 Page1.jsp 文件的支持 Bean。每当在项目中添加页面时，IDE 都会为该页面创建 .jsp 文件和 .java 文件。在下一部分中，将会介绍有关 .jsp 和 .java 文件的详细信息。

详细信息

  • 从主菜单中选择“帮助”>“帮助内容”以打开帮助文件。在左侧的“目录”窗格中，选择“Web 应用程序”>“关于 Web 应用程序”>“使用 Web 应用程序”。

创建 Web 页

对于 Visual Web JSF 应用程序，应使用 JavaServer Pages (JSP) 技术和页面 Bean（也称为支持 Bean），而不是 HTML 页。JSP 页是一个模板，服务器可通过它生成在浏览器（客户端）中显示的 HTML 响应。页面 Bean 包含服务器在生成 HTML 响应时以及在用户提交页面后执行的逻辑。

在 Visual Web JSF 应用程序中添加 Web 页时，IDE 将创建 JSP 文件和 Java 源文件。通常，可以使用可视设计器和“属性”窗口来开发 Web 页。IDE 将修改 JSP 代码和 Java 代码以实现所设计的内容。通过可视设计器和“属性”窗口可以完成大部分工作。

注意：IDE 生成的 JSP 页是 JSP 文档。JSP 文档是 XML 文档，因此必须具有正确的格式。尽管大多数 JSP 元素遵循 XML 语法，但仍有一些元素不符合 XML 规范，例如注释、声明、指令、表达式和 scriptlet。有关 JSP 文档语法，请参见 JavaServer Pages 语法参考。

 

试试看

  1. 在“项目”窗口中，右键单击“Web 页”节点，然后选择“新建”>“Visual Web JSF 页”，如下图所示。

    右键单击“Web 页”节点

  2. 接受缺省名称 Page2，然后单击“完成”。IDE 将在可视设计器（位于编辑区域）中打开 Page2，如下图所示。

    可视设计器

  3. 单击编辑工具栏中的 "Java" 按钮以查看页面 Bean 的源代码，如下图所示。当编辑区域显示 Java 源代码时，“导航”窗口将列出所有成员字段和方法。请注意，页面的源代码中包含用于访问应用程序 Bean、会话 Bean 和请求 Bean 的方法。有关这三种 Bean 的说明，请参见本教程中的存储和传递数据部分。

    页面 Bean 的 Java 源代码

  4. 源代码中还包含在某些生命周期事件期间调用的方法，这些事件发生在请求页面之后、完成页面呈现之前的一段时间内。

    提示：在“导航”窗口中双击某个成员时，将会打开源代码编辑器并将光标置于该成员的声明上。您也可以在“导航”窗口中单击鼠标，然后开始键入成员名称的前几个字符以打开“快速搜索”对话框。继续键入内容，直至 IDE 在列表中突出显示所需的条目，如下图所示。随后可按 Enter 键以打开源代码编辑器，并将光标置于匹配成员的声明上。

    “导航”窗口中的“快速搜索”

  5. 单击编辑工具栏中的 "JSP" 按钮以查看页面的 JSP 代码，如下图所示。请注意 JSP 页如何使用 JSP 文档语法。

    图 7："JSP" 视图

  6. 在单击编辑工具栏中的“设计”按钮时，将会切换至可视设计器，并在“导航”窗口中显示页面的表示形式。如果打开 "Page2" 节点下面的节点，则可以看到下图中显示的节点。请注意 JSP 文件中的标记如何在“导航”窗口中表示为节点。

    图 8：显示节点的“导航”窗口

详细信息

  • 从主菜单中选择“帮助”>“帮助内容”以打开帮助文件。在左侧的“目录”窗格中，选择“Web 应用程序”>“创建和编辑 Web 组件”>“关于创建 Web 组件”。
  • JavaServer Pages 技术 - 文档

将组件添加到 Web 页

可通过将组件从“组件面板”窗口拖放到可视设计器中的 Web 页上来设计 Web 页。下图显示了 Page2，其中包含按钮、文本字段、消息、下拉列表和单选按钮组组件。所有这些组件都是从组件面板的“基本”类别中获取的。并且，通过更改这些组件的属性对其进行了定制。可以从本部分后面了解有关属性的信息。

图 9：可视设计器中的组件

 

注意：组件面板中提供的组件是 JavaServer Faces (JSF) 组件，已根据设计时 API 对其进行了改进，以便在可视设计器和“属性”窗口中使用其属性。可以在通过 IDE 生成的 Web 应用程序中使用其他组件，但无法对这些组件使用 IDE 的交互式设计时功能，除非已根据设计时 API 的要求对其进行了定制。如果将 Java EE 版本设置为 Java EE 5，组件面板将提供 JSF 1.2 组件。在创建项目时，如果将 Java EE 版本设置为 1.3 或 1.4，组件面板将提供 JSF 1.1 组件。

所使用的大多数组件都位于“组件面板”窗口的“Woodstock 基本”、“Woodstock 布局”和“Woodstock 组合”类别中。下面的几个表显示了一些最常用的组件，并按功能对其进行了分组。

表 1：输入组件

组件 描述 组件面板类别
文本字段 单行文本的输入字段。 (Woodstock) 基本
文本区域 多行文本的输入字段。 (Woodstock) 基本
下拉列表 下拉菜单，也称为组合框。 (Woodstock) 基本
列表框 用户可以从中选择一项或多项（具体取决于组件的配置方式）的列表。 (Woodstock) 基本
复选框 单字符框，用户可以选中或取消选中该框。 (Woodstock) 基本
单选按钮 单个单选按钮，用户可以选中该按钮。 (Woodstock) 基本
口令字段 可将输入字符回显为替换字符以屏蔽输入内容的输入字段。 (Woodstock) 基本
文件上载 具有文本输入字段和“浏览”按钮的组件，该按钮显示一个文件选择器以指定要上载的文件。当用户提交页面时，应用程序将上载指定的文件。 (Woodstock) 基本
添加删除 包含两个列表（一个显示可用选项，另一个显示选定选项）和一些按钮（用于在列表间移动选项并对选定选项进行排序）。 (Woodstock) 组合
日历 包含输入字段和用于选择日期的日历。 (Woodstock) 基本

 

表 2：显示组件

组件 描述 组件面板类别
标签 可以与输入字段关联并且可以为其指定弱、中或强字体样式的文本字段。 (Woodstock) 基本
静态文本 用于显示文本的字段。 (Woodstock) 基本
图像 内联图像。 (Woodstock) 基本
消息 链接到特定组件的文本字段，用于显示有关该组件的验证错误和其他消息。 (Woodstock) 基本
消息组 文本字段，用于显示运行时错误消息、程序生成的错误消息以及（可选）有关页面上的组件的验证错误和其他消息。 (Woodstock) 基本
页面警报 与警报组件（如下所示）类似，但用于在单独页面上显示图标和信息。 (Woodstock) 布局
警报 显示一个图标和信息性文本，如警告、错误或某个事件成功完成。 (Woodstock) 组合
隐藏字段 一个不可见字段，可用于保存数据或向服务器传递信息。 (Woodstock) 基本
页面分隔符 一条水平线，可调整大小至用户选择的任意页面宽度。 (Woodstock) 布局
窗体 用于添加窗体。 (Woodstock) 布局
内联帮助 提供在页面上内联显示的简短帮助信息。 (Woodstock) 组合
气泡式帮助 用于在鼠标悬停期间显示。可以手动设置延迟或气泡显示的时间长短。 (Woodstock) 组合
可折叠面板 用于设置垂直标签。 (Woodstock) 组合

 

表 3：分组组件

组件 描述 组件面板类别
复选框组 在网格式布局中显示两个或更多复选框。 (Woodstock) 基本
单选按钮组 在网格式布局中显示两个或更多单选按钮，并确保每次只能选中一个按钮。 (Woodstock) 基本
表、表行组和表列 显示复合数据类型的数据，如数据库表或数组。 (Woodstock) 基本
网格面板 在行和列布局内组织组件。 (Woodstock) 布局
组面板 以流式布局模式将一些组件划分到一组。 (Woodstock) 布局
布局面板 用于以流式布局模式或网格式布局模式将一些组件划分到一组。 (Woodstock) 布局
标签集和标签 在同一页中显示不同的布局。也可以用作导航工具。 (Woodstock) 布局
页面片段框 将两个或更多页面上显示内容保持一致的组件划分到一组。 (Woodstock) 布局
属性表单、属性表单部分和属性 快速布置单列标签组件并对组件进行分类。 (Woodstock) 布局
Breadcrumbs 布置一系列链接组件，并用右尖括号 (>) 分隔这些组件。 (Woodstock) 组合

 

表 4：操作组件

组件 描述 组件面板类别
按钮 用于提交关联表单的按钮。 (Woodstock) 基本
超级链接 用于提交 URL 或表单的文本字段。 (Woodstock) 基本
图像超级链接 用于提交 URL 或表单的图像。 (Woodstock) 基本
标签 标签集或标签的子组件。标签可以选择提交 URL 或表单。 (Woodstock) 布局
常见任务 指向用户可以在其中执行任务的 Visual Web JSF 页的链接。 (Woodstock) 组合

 

可以使用“属性”窗口中的组件属性表单更改组件的外观和行为，将组件绑定到数据，以及将组件与事件处理程序相关联。

下图显示了列表框组件的属性。

“属性”窗口中的列表框属性表单

 

试试看

打开按照“创建 Web 页”部分中的试试看建议创建的 Page2，或者创建该页面（如有必要）。

从“组件面板”窗口的“基本”类别和“布局”类别中拖动各种组件，并尝试设置其属性。例如，尝试执行以下步骤：

 

  1. 将一个按钮组件拖到页面上，键入 Click Me!，然后按 Enter 键。在“属性”窗口中，请注意 text 属性值已更改为 Click Me!。在“属性”窗口中，选中 primary 属性的复选框，并请注意按钮外观发生了哪些变化。

    注意：IE7 存在一个已知问题，它会影响 JSF 1.2 按钮组件的宽度。解决方法是，将按钮组件放在布局组件（网格面板、组面板或布局面板）中。调整布局组件大小时，将会自动调整按钮组件的大小。

  2. 将一个文本字段组件拖到页面上。接下来，将一个标签组件拖到页面上，键入 Name:，然后按 Enter 键。按住 Ctrl-Shift 组合键并单击标签组件内部，拖动一条连线到文本字段组件，然后松开鼠标按钮。选择标签组件，并请注意其 for 属性现在已设置为文本字段组件的 id。将 labelLevel 设置为“强 (1)”。
  3. 将一个消息组件拖到文本字段的右侧。按住 Ctrl-Shift 组合键，并从消息组件拖动一条连线到文本字段组件。与标签组件一样，请注意消息组件的 for 属性现在已设置为文本字段组件的 id。
  4. 将一个下拉列表组件拖到页面上，并将其 label 属性设置为 Color。右键单击下拉列表组件，然后选择“配置缺省选项”以打开“选项定制器”。
  5. 按 Tab 键进入“显示”列中“项 1”的编辑模式，然后键入 Blue。按两次 Tab 键，将“项 2”更改为 White。再按两次 Tab 键，将“项 3”更改为 Green。单击“确定”，并请注意所做的更改对可视设计器中的组件有何影响。

  6. 使用类似步骤创建一个带有选项 Blue、White 和 Red 的单选按钮组组件，但更改选项后不要关闭“选项定制器”。

    在“选项定制器”中，选中“选择项目”复选框，然后在“选定”列中选择某个单选按钮以将其设置为缺省选项。单击“确定”以应用所做的更改并关闭“选项定制器”。在“属性”窗口中，将 columns 属性设置为 3，以使单选按钮水平对齐而不是垂直对齐。
  7. 右键单击页面背景（页面中的任何空白处），然后选择“在浏览器中预览”，以查看浏览器是如何呈现这些组件的。

详细信息

获得帮助

IDE 提供了一个帮助查看器，其中包含有关 IDE 的帮助主题。此外，在窗口、对话框或组件面板组件上按 F1 键时，将会出现帮助查看器并显示有关该项的信息。要访问 Visual Web JSF Pack 帮助主题（包括有关组件的帮助），也可以从主菜单中选择“帮助”>“帮助内容”，然后滚动至“Web 应用程序”。

 

试试看

  1. 在复选框组的“属性”窗口中单击鼠标。按 F1 键以查看有关复选框组组件属性的主题。
  2. 在组件面板的“基本”类别中选择文本字段组件的节点。按 F1 键以查看有关文本字段组件的帮助主题。

测试 Web 应用程序

在准备好测试项目后，请按 F6 键，或者从主菜单中选择“运行”>“运行主项目”。

注意：缺省情况下，将在启用“在保存时编译”功能的情况下创建项目，因此无需先编译代码即可在 IDE 中运行应用程序。有关“在保存时编译”功能的详细信息，请参见创建、导入和配置 Java 项目指南的“在保存时编译”部分。

IDE 将执行以下操作：

  • 保存所有需要保存的文件。

  • 编译所有需要编译的文件。

    如果出现问题，IDE 将在“输出”窗口（如下所示）中显示相关的错误消息，并且不会继续执行生成并运行进程。单击错误消息中的链接可转至导致出现编译错误的源代码。
  • 启动应用服务器（如果尚未启动）。

  • 将应用程序部署到应用服务器上。

    如果出现任何问题，IDE 将在“输出”窗口中显示相关的错误消息，并且不会继续执行生成并运行进程。

  • 打开浏览器并将部署的应用程序 URL 发送到浏览器，浏览器随即将显示起始页。

    注意：如果在起始页以外的页面上添加了组件，则在本教程的这一阶段，还不能在 Web 浏览器中看到这些组件。请参见下面的“试试看”部分，以了解如何设置从应用程序起始页到其他页面的导航。

    显示已成功生成项目的“输出”窗口

如果进行了大量更改或删除了一些项，或者出现某个异常行为，您可以从主菜单中选择“生成”>“清理并生成主项目”。IDE 将清理项目的 build 和 dist 目录，取消部署 Web 应用程序，然后生成并部署应用程序。

 

试试看

  1. 如果项目中包含的页面少于两个，请在“项目”窗口中右键单击“Web 页”节点并选择“新建”>“Visual Web JSF 页”以创建一个新页面。
  2. 在可视设计器中，打开起始页（带有箭头标记 起始页标记 的页面）。
  3. 将一个超级链接组件拖到页面上，键入 Next Page，然后按 Enter 键。
  4. 右键单击超级链接组件，然后选择“添加绑定属性”。
  5. 在超级链接组件的“属性”窗口中，单击 url 属性的省略号按钮 ，选择项目中的其他页面，然后单击“确定”。请注意 IDE 如何将 url 属性设置为 /faces/page-name.jsp。
  6. 按 F6 键以生成并运行 Web 应用程序。
  7. 在生成过程中，查看在“输出”窗口中显示的消息。另请注意，服务器标签中显示了来自服务器日志的输出。
  8. 注意 IDE 发送到浏览器的 URL。
  9. 当浏览器中出现起始页时，单击 "Next Page" 链接。

  10. 返回至 IDE，在“服务”窗口中展开“服务器”和相应的服务器节点，然后展开“应用程序”>“Web 应用程序”，请注意其中包含该项目的节点（如下图所示）。

    部署的 Web 应用程序

详细信息

  • 从主菜单中选择“帮助”>“帮助内容”以打开帮助查看器。然后，在“目录”窗格中选择“Web 应用程序”>“创建 Web 应用程序”>“关于创建 Web 应用程序”。

连接 Web 页和处理用户操作

当用户键入 URL、单击链接或单击按钮时，浏览器将会向服务器发送请求。服务器将请求映射到 JSP 页，并使用该 JSP 页及其关联页面 Bean 呈现响应。

可以使用下列两种方法之一指定页面导航：

  • 在页面中添加链接组件（如超级链接组件），在树组件中添加树节点组件，或者在标签集组件中添加标签组件。然后，将所添加的组件的 url 属性设置为 /faces/page-name.jsp。在使用 url 属性进行导航时，将不会提交表单数据。Web 应用程序仅导航至目标位置。
  • 使用页面流编辑器将操作映射到页面，并使用可视设计器和 Java 源代码编辑器创建操作处理方法。在使用操作处理方法进行页面导航时，将在 Web 应用程序导航至指定目标位置之前提交并处理表单数据。

要访问页面流编辑器，请在可视设计器中右键单击页面背景，然后选择“页面导航”。

页面流编辑器将显示项目中所有页面的图标 。在页面流编辑器中单击页面图标的 + 元素时，将会展开该图标并显示其所有操作组件（具有 action 属性的组件），如按钮、超级链接或标签。每个组件旁边都有一个连接端口。在下图中，超级链接的连接端口看起来像一个链条，而按钮的连接端口则显示一个箭头。可通过从连接端口拖动一条连线到页面图标，在该操作的请求与作为请求响应呈现的页面之间创建映射。在松开鼠标按钮时，IDE 将添加该连接的可视表示，如下图中带有 nextPage 标签的连接所示。

页面流编辑器  

注意：在提交页面时，Web 应用程序将先执行转换和验证，然后再执行操作方法。如果转换或验证失败，则不会调用操作方法。在开发过程中，应在页面上放置消息组组件，以便捕获任何意外转换或验证错误，这些错误可能会禁止调用操作方法。

 

试试看

  1. 创建名为 Page1 和 Page2 的两个页面。右键单击 Page1 并选择“设置为起始页”，以将其作为起始页。
  2. 将一个超级链接组件拖到 Page1 上，键入 Next Page，然后按 Enter 键。
  3. 右键单击超级链接组件，然后选择“添加绑定属性”。
  4. 将一个按钮组件拖到 Page2 上，键入 Go，然后按 Enter 键。
  5. 右键单击按钮组件，然后选择“添加绑定属性”。

  6. 双击按钮组件以访问按钮的操作方法。

    请注意，操作方法返回 null。当操作方法返回 null 时，应用程序将重新显示页面。
  7. 单击工具栏中的“设计”以切换至可视设计器。
  8. 在可视设计器中，右键单击 Page2 的页面背景，然后选择“页面导航”。
  9. 在页面流编辑器中，单击 Page1.jsp 的图标以展开该页的图标，然后从 hyperlink1 组件的连接端口拖动一条连线到 Page2.jsp 的图标。
  10. 双击 case1 连线标签以更改为编辑模式，键入 nextPage，然后按 Enter 键。
  11. 使用类似步骤从 Page2.jsp 上的按钮拖动一条连线到 LinkPage1.jsp，并将该连线命名为 go。
  12. 在编辑工具栏中单击 "XML" 以查看部署到服务器上的实际映射 XML，然后关闭页面流编辑器；当系统询问您是否保存所做的更改时，请单击“保存”。

  13. 在 Page2 中，双击按钮组件以访问按钮的操作方法。

    请注意，操作方法现在返回字符串 "go"。每当 Page2.jsp 返回 "go" 时，在页面流编辑器中创建的映射将指示服务器显示 LinkPage1.jsp。
  14. 按 F6 键运行应用程序，并试用新的页面导航。

 

详细信息

  • 在 Web 应用程序中的页面之间进行导航
  • 打开导航编辑器并按 F1 键，或者从主菜单中选择“帮助”>“帮助内容”以打开帮助查看器，然后在“目录”窗格中选择“Web 应用程序”>“创建和编辑 Web 应用程序”>“页面”>“关于页面流编辑器”。

编辑 Java 代码

IDE 的 Java 编辑器包含用于简化编程过程的各种功能，远远不止本基础教程中所讨论的这些功能。如果在 Java 编辑器窗口中单击鼠标并按 F1 键，则可以获得有关此编辑器的大多数功能的帮助。

以下说明介绍了一些比较有用的编辑功能。

  • 代码完成。通过使用代码完成功能，您可以键入几个字符，然后从可能的类、方法和变量等列表中进行选择以自动完成表达式。要显示代码完成框，请按 Ctrl-空格键。在包名、变量或方法调用后面键入句点后稍等片刻，也会出现代码完成框，如下图所示。

    代码完成框
  • Javadoc。代码完成功能还会显示任何相关的 Javadoc。此外，也可以右键单击某个类型、字段或方法，然后选择“显示 Javadoc”以查看该项的 Javadoc（如果有可用的 Javadoc）。要查看可用的 Javadoc，请选择“帮助”>“Javadoc 引用”。也可以按 Shift-F1 组合键以显示“Javadoc 索引搜索”工具。
  • 修复导入。按 Ctrl-Shift-I 组合键可自动添加所需的导入语句。

  • 错误检测。对于所有无法编译的语句，将在其左旁注中显示红色错误框。将鼠标悬停在错误框上可查看错误描述，如下图所示。IDE 还会在右旁注中显示错误带区。此带区表示整个文件，而不仅仅是可见的代码行。错误带区中的红线用于标识代码中的错误。双击红线可跳至错误语句。在编译文件时，将在“输出”窗口中显示所有编译错误。单击错误消息可在 Java 编辑器中显示错误代码。

    错误检测

  • Java 编辑器快捷键。可以使用简单的组合键（如以下示例所示）调用很多常见编辑任务。要了解有关快捷键的详细信息，请从主菜单中选择“帮助”>“帮助内容”以打开帮助查看器，然后在“目录”窗格中选择“IDE 基础知识”>“快捷键”>“编辑器快捷键”。

    操作 快捷键
    设置代码格式 Alt-Shift-F
    删除当前行 Ctrl-E
    将插入点移至突出显示的匹配方括号 Ctrl-[
    选择一对方括号之间的代码块 Ctrl-Shift-[

  • 代码模板。代码模板是在按空格键时展开为完整的词或短语的简短字符组，如以下示例所示。要查看完整的代码模板列表，请选择“工具”>“选项”（Microsoft Windows 系统上）或 "NetBeans" >“首选项”（Macintosh 系统上），然后选择“基本选项”>“编辑器”>“代码模板”并单击“代码模板”属性的省略号 按钮。例如：

    代码 缩写词
    for (Iterator it = collection.iterator(); it.hasNext();)
    {Object elem = (Object) it.next();}    		 forc
    for (int i = 0; i < arr.length; i++) {} fori
    try {|} catch (Exception ex)
    {log("Error Description", ex); } finally {}    		 trycatch

  • 代码片段。在打开 Java 编辑器时，“组件面板”窗口将提供很多有用的代码片段，您可以将这些代码片段拖放到源文件中。对于受管 Bean 源文件（如应用程序 Bean 或请求 Bean 的源文件），并不会显示这些代码片段。

    注意：如果单击工具栏中的 "JSP" 以打开 JSP 编辑器，则会在“组件面板”窗口中看到可在 JSP 文件中使用的 JavaScript 工具提示。
  • 快速搜索。如果在“导航”窗口中单击鼠标并开始键入某个方法或字段的名称，则将出现“快速搜索”对话框，并且 IDE 会突出显示列表中的第一个匹配条目。按 Enter 键可在 Java 编辑器的源代码中定位到该条目的声明。

 

试试看

注意：以下练习要求在 destroy 方法中键入代码。键入的代码用于说明编辑功能。通常，不会在该方法中放置与此类似的代码。在完成以下步骤后，应删除该代码。

  1. 创建一个页面或打开一个现有页面。将一个超级链接组件拖放到页面上。单击编辑工具栏中的 "Java" 以显示 Java 源代码。
  2. 在左旁注中单击鼠标右键，然后选择“显示行号”。在 Java 源代码中按 Ctrl-G 组合键，在“转至行”对话框中键入 100，然后按 Enter 键。
  3. 单击“导航”窗口的标签，然后双击 "destroy()" 以在源代码中定位到该方法。在 destroy() 方法中，键入 getSessionBean1().，然后稍等片刻。将出现代码完成框。键入 d 可看到该框将列表范围缩小为 destroy()。按 Enter 键以使用所选内容。按 Ctrl-空格键。现在，键入 this.getH，然后等待出现代码完成框。将光标向下移至 getHyperlink1()，然后按 Enter 键。键入句点，等待出现代码完成框，然后键入 set。在代码完成框将列表范围缩小为所有以 set 开头的方法后，键入 te 以将列表范围缩小为 setText(Object text)，然后按 Enter 键。IDE 将在句点后面插入 setText()，并将光标置于圆括号内。键入 "hello"，按 End 键，然后键入 ;。
  4. 另起一行，键入 serr，然后按 Tab 键将该缩写展开为 System.err.println("")。删除行尾的分号。按 F9 键以编译文件。“输出”窗口将显示几个指向错误的链接。单击该窗口中显示的第一个链接。IDE 将显示导致出现错误的语句。重新键入刚才删除的分号。
  5. 另起一行，键入 getSes，然后按 Ctrl-K 组合键。IDE 将使用当前行上面的源代码中的第一个匹配词替换该字符串。
  6. 要清除代码，请将光标置于 destroy 方法主体的第一行中，然后按 Ctrl-E 组合键以删除该行。使用 Ctrl-E 组合键删除该方法主体中的其余行。
  7. 将鼠标悬停在编辑工具栏中的图标上，并试用每个图标。
  8. 在 Java 源代码中单击鼠标右键，然后从弹出式菜单中选择“代码折叠”。尝试执行子菜单中的各项操作。
  9. 尝试从组件面板中拖动代码片段，以查看它们所提供的内容。

 

详细信息

  • 从主菜单中选择“帮助”>“帮助内容”以打开帮助查看器，然后在“目录”窗格中选择“Java 应用程序”>“编辑源文件”>“关于编辑源文件”。
  • 从主菜单中选择“帮助”>“帮助内容”以打开帮助查看器，然后在“目录”窗格中选择“IDE 基础知识”>“快捷键”>“常规编辑器快捷键”。
  • Java 编辑器用户指南常见问题解答

处理用户输入

IDE 提供了验证器和转换器对象，以便检查输入和设置输入的格式。可以在组件面板的相应类别中找到这些对象。

通过将验证器拖放到输入组件（如文本字段组件）上，可以将验证器绑定到该输入组件。例如，在可视设计器中的页面上添加文本字段组件后，可以将一个长度验证器从组件面板的“验证器”类别拖放到该文本字段上。

或者，也可以将验证器拖放到页面上，然后将输入组件的 validator 属性设置为该验证器对象。例如，可以将一个长整型范围验证器拖放到页面上的空白处，此时将在“导航”窗口中添加 longRangeValidator1。接下来，可以在可视设计器中选择一个输入组件（如文本字段组件），然后从其 validatorExpression 属性的下拉列表中选择 "longRangeValidator1"。同一验证器可以用于多个组件。

转换器的机制与验证器类似。转换器还可与输出组件（如静态文本组件）相关联。请注意，在将组件绑定到数据提供器字段时，将会自动完成转换过程。可以从连接数据库部分了解有关绑定到数据提供器的信息。

使用验证器的“属性”窗口可以设置验证规则，如最小和最大值或最小和最大长度。同样，使用转换器的“属性”窗口可以设置转换规则，如值应该匹配的模式或进行验证时调用的方法。数值转换器具有一个专用向导，第一次将数值转换器拖放到页面或可视组件上时，将会出现该向导。

组件面板的“基本”类别中提供了消息组件和消息组组件，这些组件用于自动显示转换错误、验证错误和必填字段消息。消息组组件显示全局错误消息、运行时错误和（可选）所有组件错误消息。消息组件仅显示其绑定的组件的消息。要将消息组件绑定到其他组件，请设置消息组件的 for 属性，或者按住 Ctrl-Shift 组合键，并从消息组件拖动鼠标至要将其绑定到的组件。

通过在任何页面 Bean 中使用 error、warn、fatal 和 info 方法，可以按编程方式将定制错误消息发送到消息组组件。要了解有关这些方法的详细信息，请选择“工具”>“Javadoc 索引搜索”，在下拉列表的文本字段中键入 FacesBean，然后单击“查找”。

 

试试看

  1. 创建一个页面，并将一个按钮拖到该页面上。将按钮的 text 属性设置为 Go。
  2. 将一个文本字段组件拖到页面上。在文本字段组件的“属性”窗口中，选中 required 属性的复选框。
  3. 右键单击文本字段组件，然后选择“添加绑定属性”。
  4. 将一个标签组件拖放到文本字段组件的上方，键入 Price:，然后按 Enter 键。
  5. 在标签组件的“属性”窗口中，从 for 属性的下拉列表中选择 "textField1"。请注意可视设计器中的标签会显示一个星号，以指示必须为其关联的文本字段组件输入内容。

  6. 在组件面板中，展开“验证器”类别。将一个双精度范围验证器拖放到文本字段组件上。在“导航”窗口中，选择新创建的 doubleRangeValidator1 节点。在该验证器的“属性”窗口中，将 maximum 属性设置为 10.0，并将 minimum 属性设置为 1.0，如下图所示。

    双精度范围验证器属性

  7. 在组件面板中，展开“转换器”类别。将一个数值转换器拖放到文本字段组件上。将出现“数字格式”对话框，如下图所示。从“类型”下拉列表中选择“货币”，从“语言环境”下拉列表中选择“英文（美国）”，然后单击“确定”。

    数字格式

  8. 在页面上添加一个消息组件。按住 Ctrl-Shift 组合键，并从该组件拖动一条连线到文本字段组件。

    请注意，IDE 会将消息组件的 for 属性设置为文本字段组件的 id。
  9. 在页面上添加一个消息组组件。

  10. 将该页设置为起始页，然后运行应用程序。尝试在下列情况下单击按钮：未输入价格、输入 1.5、输入非数字值以及输入大于 $10.00 的价格。最后，在文本字段中键入 $1.50，然后单击按钮。

    请注意应用程序如何拒绝所有不符合数字格式的值以及不在指定范围内的值。同时，还请注意在消息组件和消息组组件中出现的不同消息。
  11. 尝试为消息组组件设置 showGlobalOnly 复选框。

 

详细信息

存储和传递数据

可以使用应用程序 Bean、会话 Bean 和请求 Bean 存储信息以供其他页面使用。

  • 使用应用程序 Bean 可以存储适用所有用户会话的信息，如下拉列表组件的静态选项列表。
  • 使用会话 Bean 可以存储在整个用户会话期间供其他页面使用的信息，如用户的登录名。

  • 如果需要仅供下一个页面使用的信息，请使用请求 Bean。

    请求结束后，在请求 Bean 中存储的任何值都会消失。请求是指从客户端单向传输到服务器的 HTTP 请求以及对应的响应（可以是其他页面）。大多数情况下，请求都以单击按钮或链接开始，并以显示 HTML 页作为响应结束。

    注意：仅当启动请求的页面在请求 Bean 属性中存储值时，才会实例化请求 Bean，例如，将输入组件绑定到请求 Bean 属性时（如下所述）。

    警告：如果将 <redirect> 元素包含在导航规则的 <navigation-case> 元素中，则无法使用请求 Bean。（在页面流编辑器中单击“源”按钮时，可以看到这些规则。）在提交页面时，<redirect> 元素先重定向该页并结束请求，接下来，后续页面才能使用请求 Bean 中存储的任何值。

在会话 Bean 中添加属性：

  1. 在“导航”窗口中双击 "SessionBean1" 节点。

    此时将在 Java 编辑器中打开 SessionBean1.java。
  2. 在构造函数 public class SessionBean1 extends AbstractSessionBean 中添加 answer 属性。
  3. 修复导入（如有必要）。

  4. 在编辑器中单击鼠标右键，然后选择“重构”>“封装字段”。在出现的对话框中，如果该属性为只读属性，创建 getter 方法；如果该属性为读/写属性，创建 getter 和 setter 方法。

    在“导航”窗口中，该属性将显示为 "SessionBean1" 下面的子节点，但通常不会立即显示。

 

可以使用类似步骤在请求 Bean 或应用程序 Bean 中添加属性。有关详细信息，请参见以下常见问题解答：如何在 NetBeans IDE 的受管 Bean 中添加属性？

注意：也可以在页面 Bean（IDE 为每个页面创建的支持 Bean）中添加属性。要在页面 Bean 中添加属性，请打开页面的 Java 代码，在构造函数 public class Page1 extends AbstractPageBean 中添加属性声明，然后按照上述方法封装字段。页面 Bean 属性值仅在页面 Bean 实例化期间有效。例如，当用户单击用于重新呈现页面的按钮组件时（即，操作方法返回 null），将会创建该页面 Bean 的新实例并重新初始化页面 Bean 的属性值。如果要为传回操作传递值，您可以使用隐藏字段组件。

要将组件与 Bean 属性相关联，请右键单击该组件，然后选择“绑定到数据”。在“绑定到数据”对话框中，选择“绑定到对象”标签，然后选择 Bean 属性，如下图所示。

“绑定到数据”对话框

 

注意：对于大多数组件，弹出式菜单提供了两种绑定操作：“属性绑定”和“绑定到数据”。通过使用“属性绑定”对话框，可以将组件的任何属性绑定到受管 Bean 属性或数据提供器字段。“绑定到数据”对话框提供了一种快捷方式，用于将包含值的组件属性绑定到受管 Bean 属性或数据提供器字段。通过使用“绑定到数据提供器”标签，可以绑定已添加到页面或受管 Bean 中的任何数据提供器。通过使用“绑定到对象”标签，可以绑定页面属性或受管 Bean 属性。

 

试试看

  1. 在 RequestBean1.java 中添加一个属性：将该属性命名为 parm，将其类型设置为 String，并允许用户以读/写方式进行访问。

    请注意，“导航”窗口中可能没有显示新添加的属性。要显示该属性，请在可视设计器中单击鼠标右键，然后从弹出式菜单中选择“刷新”。也可以按照以下步骤所述，打开并保存 RequestBean1 源文件以显示该属性。
  2. 关闭该文件，在出现的对话框中，单击“保存”。
  3. 创建一个名为 First 的页面，其中包含一个按钮组件和一个文本字段组件。
  4. 右键单击按钮组件，然后选择“添加绑定属性”。
  5. 右键单击文本字段组件，然后选择“添加绑定属性”。
  6. 右键单击文本字段组件，然后从弹出式菜单中选择“绑定到数据”。单击“绑定到对象”标签，选择 "RequestBean1" > "parm"，然后单击“确定”。
  7. 创建一个名为 Next 的页面。添加一个按钮组件和一个静态文本组件。
  8. 右键单击按钮组件，然后选择“添加绑定属性”。
  9. 右键单击静态文本组件，然后选择“添加绑定属性”。
  10. 使用与 First 页上的文本字段组件相同的步骤，将 Next 页上的静态文本组件绑定到 "RequestBean1" > "parm"。
  11. 右键单击页面背景，然后从弹出式菜单中选择“页面导航”。
  12. 在页面流编辑器中，从 First 页上的按钮组件拖动一条连线到 Next 页。不用考虑 Next 页上的按钮组件，因为希望此按钮使 Next 页仅重新呈现自身。
  13. 将 First.jsp 设置为起始页，然后运行应用程序。输入一个值，然后单击按钮。请注意，Next 页将显示在 First 页上输入的值。在后台，将实例化一个 RequestBean1 实例，用于在 parm 属性中存储文本字段组件的值。随后，将检索 parm 属性值以做出响应（Next 页的 HTML）。在呈现响应后，将会销毁 RequestBean1 实例。
  14. 单击 Next 页上的按钮以使 Next 页重新呈现自身。请注意，静态文本组件不再显示值。这是因为保存值的 RequestBean1 实例的存在时间与请求时间一样长，从提交 First 页时开始，到向客户端发回 Next 页的 HTML 时结束。

详细信息

连接数据库

“服务”窗口中包含一个“数据库”节点，该节点显示在 IDE 中注册的所有数据库，如下图所示。NetBeans IDE 提供了一个样例 TRAVEL 数据库，您将在本教程的其余部分中使用该数据库。

数据源

 

您必须先将 IDE 连接到数据库，然后才能在项目中访问该数据库。每次启动 IDE 并打开连接到数据库的项目时，必须执行此操作。

如果数据库标记显示为连接中断 ，并且无法展开数据库节点，则表明 IDE 未连接到该数据库。要连接到 TRAVEL 数据库，请在“服务”窗口中右键单击该数据库节点，然后从弹出式菜单中选择“连接”。如果出现“连接”对话框，请在“口令”中输入 travel，然后选中“在此会话期间记住口令”。

在打开现有项目时，可视设计器可能会显示一个错误屏幕。通常，这是因为可视设计器需要获取数据库中的信息，而 IDE 没有连接到数据库所致。请尝试连接数据库服务器，并在错误屏幕中单击“继续”按钮以解决该问题。

通过将表从数据源部分拖放到页面上的组件或页面上，可以连接页面和数据库表。在执行此操作时，IDE 将在页面中添加数据提供器，并在 SessionBean1 类中添加行集，如下图所示。

数据提供器和行集

 

行集对象将建立数据库连接、执行查询以及管理结果集。数据提供器对象提供了一个通用接口，用于访问多种类型的复合数据，其中包括数据库表、ArrayList 对象以及 Enterprise JavaBeans 对象。通常，仅在需要设置查询参数时才会使用行集对象。大多数情况下，将使用数据提供器对象访问和处理数据。

在项目中添加数据提供器后，可以右键单击某个组件并选择“绑定到数据”，以将其绑定到该数据提供器。在“绑定到数据”对话框中，单击“绑定到数据提供器”标签以将其置于前端。选择数据提供器下拉列表显示了项目的所有数据提供器，可以从中选择要绑定到组件的数据提供器。在选择数据提供器后，请选择要绑定到组件的相应数据列。对于某些组件（如下拉列表组件），必须选择值字段和显示字段。

要定义用于检索数据的 SQL 查询，请使用查询编辑器，如下图所示。可以通过行集对象来访问此编辑器。

查询编辑器

 

试试看
  1. 创建一个页面，将其设置为起始页，然后将一个列表框组件拖放到该页面上。
  2. 在“服务”窗口中，依次展开“数据库”节点、TRAVEL 数据库的 jdbc 节点和“表”节点。

  3. 将 "TRIPTYPE" 节点拖到页面上。

    注意：如果 TRAVEL 数据库标记显示为连接中断，并且无法展开数据库节点，则表明 IDE 未连接到该数据库。要连接 TRAVEL 数据库，请在“服务”窗口中右键单击该数据库节点，然后从弹出式菜单中选择“连接”。当出现“连接”对话框时，在“口令”中输入 travel，选中“在此会话期间记住口令”，然后单击“确定”。
  4. 右键单击列表框组件，然后选择“添加绑定属性”。
  5. 右键单击列表框组件，然后从弹出式菜单中选择“绑定到数据”。
  6. 在“绑定到数据”对话框中，单击“绑定到数据提供器”标签，并确保在选择数据提供器下拉列表中选择了 "tripTypeDataProvider"。
  7. 将“值字段”设置为 "TRIPTYPE.TRIPTYPEID"（缺省选项），并将“显示字段”设置为 "TRIPTYPE.DESCRIPTION"。单击“确定”。
  8. 运行应用程序，以查看如何在列表框中填充表数据。
  9. 在“导航”窗口中展开 "SessionBean1"，然后双击 "triptypeRowSet" 节点以打开其查询编辑器。在网格面板的 "DESCRIPTION" 行中，单击“排序类型”列中的字段，然后从下拉列表中选择“升序”。
  10. 单击标有类似 jdbc:derby://localhost:1527/travel 字样的查询编辑器标签上的 "X" 以关闭该查询编辑器，然后再次运行程序。请注意各项现在将按字母顺序进行显示。

  11. （可选）在页面 Java 源代码的 _init 方法中，查看将数据提供器与行集相关联的代码。缺省情况下，该方法处于折叠状态。要展开代码，请单击左旁注旁边显示的代码折叠框。

    在“项目”窗口中，双击“源包”> "gettingstarted" > "SessionBean1" 节点以打开会话 Bean 的 Java 源代码。查看会话 Bean 的 _init 方法，以了解行集代码是如何实现查询的。

 

详细信息

调试 Web 应用程序

IDE 具有一个可帮助解决程序问题的内置调试器，如下图所示。可以使用该调试器设置断点和监视、逐步执行代码以及运行至光标所在的代码语句。

要设置断点，请在 Java 编辑器的左旁注中单击鼠标。要设置监视，请右键单击变量或表达式，然后选择“新建监视”。要运行调试器，请从主菜单中选择“运行”>“调试主项目”或“运行”>“运行至光标位置”。

调试器窗口

 

提示：下面介绍了一些其他功能，可以使用这些功能来诊断并解决问题：

  • 使用 HTTP 监视器监视客户端和服务器之间的通信以及重新显示 HTTP 请求。如果页面中包含一些输入字段，并且您希望在不必填写所有字段的情况下重新创建 HTTP 请求，则使用重新显示请求功能会很有帮助。
  • 在页面中添加一个消息组组件，然后使用 error、warn、fatal 和 info 方法在组件中显示诊断消息。
  • 使用 log 方法将诊断消息发送到服务器日志。

 

试试看

  1. 创建或重用起始页。添加一个静态文本组件，将其 text 属性设置为 Hello，并将其 id 属性设置为 helloText。
  2. 右键单击静态文本组件，然后选择“添加绑定属性”。

  3. 添加一个按钮组件。双击按钮组件以访问其操作方法 (button1_action)，然后将方法主体替换为以下代码。

    代码样例 1：button1_action 方法 
    String oldString = (String) this.helloText.getText();
    this.helloText.setText("Good Bye");
    String newString = (String) this.helloText.getText();
    return null;

    可以按 Alt-Shift-F 组合键以重新设置刚添加的代码格式。

  4. 右键单击 "oldString"，选择“新建监视”，然后单击“确定”。对于 newString，请执行相同的操作。

    将在 IDE 底部打开“监视”标签窗口，该窗口列出了要监视的每个表达式。

  5. 在左旁注中单击鼠标，为方法主体中的第一条语句设置断点。

    将在单击位置处显示一个粉红色框，并且整行代码变成粉红色背景。
  6. 从主菜单中选择“运行”>“调试主项目”。
  7. 当在 Web 浏览器中显示该页面时，单击按钮。当调试器在 button1_action 方法内中断时，单击调试器窗口中的“监视”标签，以查看当前的 newString 和 oldString 值。
  8. 从主菜单中选择“运行”>“步过”，或者单击工具栏中的“步过”按钮 “步过”按钮。查看“监视”标签。再步过代码两次，然后查看“监视”标签中的“值”列。
  9. 查看“局部变量”和“调用栈”标签。
  10. 选择“运行”>“完成调试器会话”以关闭调试器会话。

 

详细信息

  • 从主菜单中选择“帮助”>“帮助内容”以打开帮助查看器，然后在“目录”窗格中展开“Java 应用程序”>“调试应用程序”，并阅读有关调试的主题。
  • 从主菜单中选择“帮助”>“帮助内容”以打开帮助查看器，然后在“目录”窗格中选择“IDE 基础知识”>“服务器和数据库”>“HTTP 监视器”>“关于 HTTP 监视器”。
  • “Web 应用程序的 NetBeans IDE 教程”中的运行和监视应用程序部分。

小结

  • 创建 Visual Web JSF 应用程序项目以着手构建 Web 应用程序。
  • 使用以下方法添加页面：在“项目”窗口中右键单击“Web 页”节点，然后选择“新建”>“Visual Web JSF 页”。
  • 在可视设计器中将组件从组件面板拖到页面上，以对页面进行设计。
  • 单击主工具栏中的“运行主项目”按钮，以保存、生成、部署并运行应用程序。
  • 使用页面流编辑器指定页面导航。还可以在页面中添加链接组件并设置其 url 属性值。
  • 将验证器和转换器对象拖放到组件上，以指定格式设置和验证规则。
  • 使用消息组件和消息组组件显示运行时错误消息。
  • 使用 RequestBean1、SessionBean1 和 ApplicationBean1 类中的属性存储页面上的值以及在页面之间传递值。
  • 要为数据库表创建数据提供器对象及其关联的行集，请将表从“服务”窗口的“数据库”部分拖到页面或页面的某个组件上。
  • 使用“绑定到数据”菜单操作将组件绑定到数据提供器字段，以及将组件绑定到 Bean 属性。
  • 打开行集的查询编辑器，以修改用于填充行集对象的 SQL 查询。
  • 使用调试器、HTTP 监视器、服务器日志和消息组组件诊断运行时问题。

 

另请参见

本页的最新修改时间：2008 年 10 月 22 日

 
Companion
Projects: 		                  Powered by: