使用 ADF 业务组件和 JavaServer Faces 构建端到端的 Web 应用程序

目的

在本教程中，您将使用 Oracle JDeveloper (10.1.3.1.0) 和 ADF 业务组件构建一个 Web 应用程序。ADF 业务组件用于构建数据模型，而 JavaServer Faces 用于 Web 客户端（包括主从页面、搜索页面和编辑页面）。

所需时间

60 分钟

主题

本教程包括下列主题：

	概述
	前提条件
	创建数据库连接
	使用 ADF 业务组件构建数据模型
	创建一个主从 JSF 页面
	运行 JSF
	使用业务组件控制提示
	将 ADF 业务组件添加到业务模型
	创建一个搜索页面
	创建一个编辑页面
	同步搜索和编辑页面
	总结

查看屏幕截图

将鼠标置于此图标上以加载和查看本教程的所有屏幕截图。（警告：因为此操作会同时加载所有屏幕截图，所以网速较慢时，响应时间可能会比较长。）

注：此外，您还可以在下列步骤中将鼠标放在每个单独的图标上，从而仅加载和查看与该步骤相关的屏幕截图。可以通过单击各个屏幕截图来将其隐藏。

概述

该应用程序反映了模型-视图-控制器体系结构。模型由 ADF 业务组件提供，视图和控制器由 JavaServer Faces 提供。您将使用 JSF 标准 ADF Faces 组件库构建一个美观的 Web 用户界面。ADF Faces 是一组 JSF 组件，提供了简单到复杂的数据感知控件。

您将先构建该应用程序的数据模型部分。您将在这部分中放置中间层业务逻辑和验证规则。ADF 模型层提供了
这三层（模型-视图-控制器）之间的声明式数据绑定。然后，您将创建一个主从表单，用于查看客户信息以及他们下的订单。在创建这个基本的主从关系页面后，您将创建更复杂的包含搜索和编辑等功能的页面。

在开发和测试该应用程序时，您将使用 Oracle JDeveloper 10g 提供的嵌入式 Java EE 应用服务器。完成该应用程序后，可以将其部署到 Oracle 应用服务器 10g 或其他外部应用服务器。

返回主题列表

前提条件

开始本教程之前，您应该：

返回主题列表

创建数据库连接

Java 数据库连接 (JDBC) 是 Java 应用程序用于连接关系数据库的一种标准应用程序编程接口 (API)。JDeveloper 使用连接导航器维护应用程序的连接信息。连接导航器简化了数据库连接的创建、管理和测试。

如果您尚未建立数据库连接，请通过执行以下步骤建立连接：

返回主题列表

使用 ADF 业务组件构建数据模型

数据模型提供数据访问和应用程序验证。无论客户端实现方式如何，该模型始终对数据进行验证。它将验证和业务规则与用户界面进行了清晰划分。

在以下几个步骤中，您将在 JDeveloper 中创建一个应用程序，并为应用程序创建一个业务组件模型。

	创建新的应用程序和项目
	创建业务组件
	自定义业务组件视图

返回主题列表

创建新的应用程序和项目

在 JDeveloper 中，经常需要对包含在应用程序中的项目进行操作。应用程序是控制结构中的最高级别。

JDeveloper 项目是一个用于对相关文件进行逻辑分组的组织结构。您可以将多个项目添加到应用程序，以轻松地组织、访问、修改和重用源代码。在 Applications Navigator 中，项目作为层次结构的第二层显示在应用程序的下面。

注意，建议您最好将模型代码和视图代码分离。在这一实战教程中，我们先创建一个 ADF 业务组件模型项目，随后再创建一个 JSP 视图项目。

在创建任何组件之前，您必须先创建应用程序和项目。为此，执行以下步骤：

1.	单击 Applications 选项卡，返回 Applications Navigator。 右键单击 Applications 节点，从上下文菜单中选择 New Application。
2.	在 Create Application 对话框中，输入应用程序名 OrderEntry 。注意，当您输入应用程序名时，目录名将自动改变。 输入 oracle 作为 Application Package Prefix。 从 Application Template 下拉列表中选择值 Web Application[JSF, ADF BC]。 单击 Manage Templates... 按钮。
3.	在 Application Templates 树中，为 Web Application [JSF, ADF BC] 节点选择 View and Controller，然后在 View and Controller 窗格中，将 Project Name 设置为 UserInterface.jpr，并将 Default Package 设置为 view。
4.	在 Applications Templates 树中，为 Web Application [JSF, ADF BC] 节点选择 Data Model，然后在 Data Model 窗格中，将 Project Name 设置为 DataModel.jpr，并将 Default Package 设置为 datamodel。 单击 OK。
5.	返回 Create Application，并单击 OK 创建应用程序。
6.	单击工具栏上的 Save All 以保存您的工作。或者，您可以从菜单中选择 File | Save All。 Applications Navigator 应类似于下图所示。 您现在准备为本教程创建应用程序组件。在随后的几个步骤中，您将为应用程序创建一个模型。

返回主题

返回主题列表

从表创建业务组件

在本部分中，将基于数据库中的表创建 ADF 业务组件。您将使用前面创建的 oeconn 数据库连接。在 Model 项目中创建这些对象。

1.	在 Applications Navigator 中，右键单击 DataModel 项目，然后从上下文菜单中选择 New。
2.	在 New Gallery 中，展开 Business Tier，在 Categories 列表中选择 ADF Business Components。 在 Items 列表中选择 Business Components from Tables。 单击 OK。
3.	在 Business Components Project Initialization 窗口中，从 Connection 列表中选择 oeconn 连接，然后单击 OK。
4.	如果显示 Create Business Components 向导的 Welcome 页面，则单击 Next。 如果在创建应用程序时未指定程序包名称，则默认情况下，它将使用项目名称，即 model。 注：ADF 实体对象是一个 Java 组件，它将基础数据库表中的行表示为 Java EE 应用程序中的域业务对象。它封装了该域对象的业务规则，并将用户所做的任何更改自动保存回数据库。实体对象提供了类似于 Oracle Forms 记录管理器的功能（如果您熟悉 Oracle Forms），所不同的是实体对象可以将封装的业务规则与每种类型的“业务记录”结构关联。 从 Schema 下拉列表中选择 OE。 单击 Query，填充可用表列表。 按住 Control 键，在 Available 列表中单击选择 CUSTOMERS 和 ORDERS。 单击 Add 按钮 将这两个表移入 Selected 列表中。 单击 Next 继续。
5.	在 Create Business Components Wizard 的“Updatable View Objects”页面上，选择这两个实体对象，单击 Add 按钮 将这两个表移入 Selected 列表中。 注：ADF 视图对象是一种基于一个或多个基础表表示 SQL 查询的 Java 组件。利用该组件，您可以在向最终用户提供的用户界面中，按照最终用户所需的业务信息查看方式来投影、连接、过滤和排序业务信息。关联到基础 ADF 实体对象时，视图对象允许用户创建、更新和删除行，并自动实施业务规则。视图对象提供了类似于 Oracle Forms 数据块的功能（如果 您熟悉 Oracle Forms），但视图对象可以灵活地微调 SQL 查询并自动利用实体对象封装的集中业务规则。 单击 Next。
6.	单击 Next 跳过该向导的“Read-only View Objects”页面。您将只使用可以更新的视图对象。
7.	在该向导的 Application Module 页面上，将应用程序模块命名为 OrderEntryAM 。 注：ADF 应用程序模块是一个 Java 组件，表示与主从相关的视图对象查询的事务数据模型。利用该组件，面向服务的体系结构中任何类型的客户端接口都可以轻松地操纵由其数据模型包含的视图对象实例公开的业务信息。应用程序模块提供了与 Oracle Forms Form 对象类似的事务数据容器的功能（如果您熟悉 Oracle Forms），但应用程序模块允许任何类型的用户界面使用其视图对象“数据块”中的数据。 单击 Next。
8.	JDeveloper 提供了数种管理组件的技术。一种是使用组件及其关系的图示。在此步骤中，JDeveloper 提供了这样一个图表选项。 本教程中将不涉及该选项的使用。单击 Next 继续。
9.	Business Components Wizard 的最后一页显示了将要创建的对象和关系。 单击 Finish 完成向导操作。
10.	Applications Navigator 应如下所示： 使用导航器窗格中工具栏最右侧的按钮按类型对元素进行排序。

返回主题

返回主题列表

自定义业务组件视图

在前面的几个部分中，您由两个表（Customers 和 Orders）创建了一些默认的业务组件。默认的视图对象显示了这些表中的所有列。对于您的应用程序，我们只希望显示这些列中的少数几个。使用 ADF BC，您可以轻松地自定义这些对象来满足您特定的应用程序需要。

在以下的步骤中，您将从 CustomersView 视图对象中删除某些显示的属性。

1.	在 Applications Navigator 中，右键单击 CustomersView 节点，并从上下文菜单中选择 Edit CustomersView。
2.	选择 Attributes 节点，显示视图对象中的所有属性。
3.	在 View Object Editor 的 Selected 窗格中，按住 Control 键单击除以下属性以外的所有属性： CustomerId CustFirstName CustLastName CustEmail
4.	使用 Remove 按钮 从 Selected 列表中移出选定属性。
5.	然后，您将向 CustomersView 中添加一个 Order By 子句以确保按客户 ID 对返回的数据进行排序。 在左窗格中，选择 SQL Statement 节点。
6.	在靠近 SQL Statement 窗格底部的 Order By 域中输入 Customers.CUSTOMER_ID 。 单击 OK 应用更改，并退出 View Object Editor。
7.	单击 JDeveloper 菜单栏上的 Save All 图标，或从菜单中选择 File > Save All。
	您现在已经自定义了 Customers 视图来满足应用程序的特定需要。下一步是创建一个使用 OrderEntry 模型的 Web 客户端。

返回主题

返回主题列表

创建一个 JavaServer Faces 主从页面

ADF Faces 符合 JSF 标准，使您可以专注于应用程序和布局而非标记语言和标记。由于集成了 ADF Faces 和 ADF 业务组件，因此您可以从 ADF 业务组件中轻松地更改用户界面的默认域标签。

在以下几个步骤中，您将基于刚刚构建的 ADF BC 模型创建一个 ADF Faces 应用程序。您还可以修改某些 ADF BC 默认设置来帮助增强默认的 UI。

1.	您在创建应用程序时定义了两个项目：DataModel 和 UserInterface。DataModel 项目包含用作应用程序数据模型的业务组件。UserInterface 项目将包含应用程序的视图部分，视图部分定义了用户界面。 折叠 DataModel 节点，以便 Applications Navigator 显示如下：
2.	在 Applications Navigator 中右键单击 UserInterface，然后从上下文菜单中选择 New，创建一个新的 JSF。
3.	在 New Gallery 中，展开 Web Tier 并在 Categories 列表中选择 JSF。从 Items 中选择 JSF JSP。
4.	选择新的 JSF 将打开 Create JSF JSP 向导。单击 Next 跳过 JSF JSP 向导的 Welcome 页面（如果显示该页面）。
5.	将新 JSP 命名为 CustomerOrders.jsp。接受其他默认值，单击 Next 继续。
6.	在下一个页面 Component Binding 中，选择 Do Not Automatically Expose UI Components 选项。保留其他默认值，然后单击 Next。
7.	确保选择了下列库： JSF Core 1.0 JSF HTML 1.0 ADF Faces Components ADF Faces HTML 单击 Next 接受这些库。
8.	单击 Finish 接受默认的 HTML 选项并创建新的 JSP。 您现在就创建了一个空的 CustomerOrders.jsp 页面。在随后的步骤中，您将在该页面上添加一个 ADF Faces 数据绑定组件。 该组件显示一个客户及其订单。
9.	创建 CustomerOrders.jsp 页面时，JDeveloper 在位于 JDeveloper IDE 中心的可视化编辑器中将其打开。通过将其从 Component 选项板或 Data Control 选项板拖动到可视化编辑器来添加 ADF Faces 组件。此处，您将根据以前使用 Data Control 选项板创建的视图对象来拖动某些数据绑定组件。 首先，在 Data Control 选项板中展开 OrderEntryDataAMControl。
10.	展开 CustomersView1。 注：默认情况下，Business Components from Tables 向导记录 ORDERS 和 CUSTOMER 表之间的外键关系，并在融合了 OrdersView1（使我们可以查看所有订单）与 OrdersView2（与 OrdersView1 链接在一起，显示了所有客户）功能的 OrderEntryDataAM 数据模型中创建一个默认数据模型。在此情形中，我们将使用 CustomersView1 和 OrdersView2，它们将显示客户和每个客户的订单集。
11.	将 OrdersView2 拖到可视化编辑器中。JDeveloper 打开一个上下文菜单，其中显示了可用于该数据控件的选项。
12.	将光标置于 Master-Details 选项上，然后选择 ADF Master Form, Detail Table。
13.	JDeveloper 将 ADF Master Detail 组件添加到 JSF 页面上。 您现在创建了一个数据绑定到 ADF BC 业务服务的完整 JSF。在下一步骤中，您将测试新应用程序。

返回主题列表

运行 JSF 页面

至此，您已经构建了新的 ADF Faces 应用程序，下面需要对其进行测试。JDeveloper 使您可以轻松地通过内置 OC4J 服务器来测试 JSF。在 JDeveloper 中测试页面时，将自动启动该服务器。

以下几个步骤引导您完成该测试过程。

1.	要测试页面，在 Applications Navigator 中右键单击 CustomerOrders.jsp，从上下文菜单中选择 Run。（也可以在可视化编辑器中单击右键，从上下文菜单中选择 Run 。）
2.	该页面应如下所示： 注：JDeveloper 将打开默认的 Web 浏览器并显示该页面。否则，请访问 Tools > Preferences 并选择 Web Browser and Proxy 类别。此处，您可以进入首选浏览器的命令行。然后，在设置该首选项后尝试再次运行该页面。
3.	浏览客户行，查看每个客户所下订单的差异。注意，该列表中的前几个客户有多个订单。 完成操作后关闭此浏览器。

返回主题列表

使用业务组件控制提示

现在就有了可以使用的 JSF 应用程序，接下来我们花些时间来自定义页面上的一些标签。刚才是用布局组件的默认值创建的页面。开始时采用这种方法不错，不过您可能想能更好地控制整个页面。

页面上的域标签不是硬编码的，而是在运行时派生的。这些域的值是在运行时从 ADF 业务组件定义中获得的。ADF BC 提供了一种自定义这些运行时属性的方法。可修改的属性之一称为控制提示。通过这些控制提示，您可以创建将在运行时由 ADF Faces 呈现的标签、域大小和格式掩码。

在以下几个步骤中，您将修改 CustomersView 对象的控制提示并重新启动应用程序查看这些应用的更改。

1.	您将在 Model 项目中进行更改。 在 Applications Navigator 中选择 CustomersView ( DataModel > Application Sources > oracle.datamodel)。
2.	右键单击 CustomersView，从上下文菜单中选择 Edit CustomersView。
3.	选择并展开 Attributes 节点。
4.	在 Attributes 列表中选择 CustomerId。
5.	单击 Control Hints 选项卡。
6.	在 Label Text 域中，输入一个值，如 Customer ID:。该文本域现在成为 CustomerID 域的域标签。
7.	单击以下域，将该文本添加到 Label Text 域（与对 CustomerId 的操作相同）。 CustFirstName First Name: CustLastName Last Name: CustEmail Email: 单击 OK 接受并应用更改。 注：可以将提供的控制提示转换为其他区域设置，然后 ADF 运行时将根据用户浏览器的语言设置使用与当前用户相对应的标签 。
8.	在 View 项目中右键单击 CustomerOrders.jsp，从上下文菜单中选择 Run。
9.	注意，该页面使用了您刚刚添加到 CustomersView 对象的域标签。由于集成了 ADF 组件，因此不必更改视图中的任何内容。

返回主题列表

将 ADF 业务组件添加到数据模型

在本教程的这一部分中，您需要将业务组件添加到现有的数据模型，以将视图对象添加到应用程序模块的数据模型以支持搜索页面和相关的编辑页面。搜索页面基于 Customers 和 Orders 之间的信息连接。

在以下几个步骤中，您将在数据模型中添加业务组件。

	基于 SQL 语句创建视图对象 (I)
	基于 SQL 语句创建 视图对象 (II)
	为 SearchOrders 页面创建新的视图对象
	优化视图对象并更新应用程序模块

返回主题列表

基于 SQL 语句创建视图对象 (I)

在该部分中，您将基于 SQL 语句创建一个查询 Promotions 表的只读视图组件。该视图对象提供了 Promotions 表中存储的可用值。这些值将用作编辑页面中的下拉列表。

1.	在 Applications Navigator 中，右键单击 DataModel 项目，然后从上下文菜单中选择 New。
2.	在 New Gallery 中，展开 Business Tier，在 Categories 列表中选择 ADF Business Components。在 Item 窗格中选择 View Objec。 单击 OK。
3.	单击 Next 跳过 Create View Object 向导的 Welcome 页面。在 Step 1 中，将视图命名为 PromotionsLOV。选中 Rows Populated by a SQL Query 选项并选择 Read-Only Access。 单击 Next 继续。
4.	在 Step 2 中，输入以下查询语句： SELECT Promotions.PROMO_ID, Promotions.PROMO_NAME FROM PROMOTIONS Promotions ORDER BY Promotions.PROMO_NAME 单击 Test 按钮验证 SQL 语句，单击 OK。然后，单击 Next 两次并单击 Finish。
5.	Applications Navigator 应如下所示：

返回主题

返回主题列表

基于 SQL 语句创建视图对象 (II)

在该部分中，您将基于 SQL 语句（构成 Orders 表的 Mode 列的授权值）创建一个只读视图组件。这些值将用作编辑页面中的下拉列表。

1.	在 Applications Navigator 中，右键单击 DataModel 项目，然后从上下文菜单中选择 New。
2.	在 New Gallery 中，展开 Business Tier 并在 Categories 列表中选择 Business Components。在 Item 窗格中选择 View O bjec t。 单击 OK。
3.	单击 Next 跳过 Create View Object 向导的 Welcome 页面。在 Step 1 中，将视图命名为 ModelLOV，选中 Rows Populated by a SQL query 选项并选择 Read-Only Access。 单击 Next 继续。
4.	在 Step 2 中，输入以下查询语句： select 'direct' as modevalue from dual union all select 'online' from dual order by 1 单击 Test 按钮验证 SQL 语句。然后，单击 Next 两次并单击 Finish。
5.	Applications Navigator 应如下所示：

返回主题

返回主题列表

为 SearchOrders 页面创建新的视图对象

在以下步骤中，您将创建一个视图对象来显示 Customer 和 Orders 实体对象中的数据。该向导将在基础数据库表之间创建相应的连接查询。

1.	在 Applications Navigator 中，右键单击 DataModel 节点，然后从上下文菜单中选择 New。
2.	在 New Gallery 中，展开 Business Tier 并在 Categories 列表中选择 Business Components。在 Item 窗格中选择 View Object。 然后，单击 OK。
3.	单击 Next 跳过 Create View Object 向导的 Welcome 页面。在 Step 1 中，将视图命名为 SearchOrders，选中 Rows Populated by a SQL Query 选项，然后选择 Updatable Access through Entity Objects access。 单击 Next。
4.	在 Step 2 中，选择 Orders 实体对象并单击 Add 按钮 移入选择，然后选择 Customers 并单击 Add 按钮 移入选择。 注：必须按照以上顺序移入选定实体。 单击 Next。
5.	在 Step 3 中单击 Attributes 节点，并选择以下属性： Orders.OrderId Orders.OrderTotal Customers.CustomerId Customers.CustFirstName Customers.CustLastName 单击 Add 按钮 移入选择。 然后，单击 Next
6.	在 Step 4 中，选择 OrderId 属性，注意该属性自动标记为 Key Attribute，因为它是基础 Orders 实体对象的主要 属性。由于该查询的每一行均由此 OrderId 唯一标识，因此可以删除由基础 Customers 实体对象提供的可选主要属性。 从下拉列表中选择 CustomerId 属性并取消选中 Key Attribute 复选框。 单击 Next。
7.	现在，我们想要提供一个搜索页面，使最终用户可以根据客户的名字或姓氏以区分大小写的方式进行搜索，并搜索订单总计位于给定范围内的订单。在该步骤中，您将向特定的视图对象（该视图对象引用我们希望用户能够在运行时提供的参数的命名绑定变量）中添加一个自定义 WHERE 子句。您将在此处引用绑定变量，然后在该向导的下一步中正式定义绑定变量名、数据类型和默认值。 在 Step 5 中单击 ExpertMode 复选框，然后在查询语句对话框中，在语句结尾添加以下代码： AND ORDER_TOTAL BETWEEN :TotalLow AND :TotalHigh AND (UPPER(CUST_FIRST_NAME) LIKE UPPER(:CustName) ||'%' OR UPPER(CUST_LAST_NAME) LIKE UPPER(:CustName)||'%') 单击 Test 按钮确保 SQL 语句有效。单击 Next 两次。
8.	在 Step 7 中，使用 new 按钮创建三个包含以下属性的命名绑定变量： Name Type Default CustName String TotalLow Number 0 TotalHigh Number 50000
9.	可以按照前面对视图对象属性执行的操作为命名的绑定变量定义控制提示。 选择 CustName 变量并单击 Control Hints 选项卡。在标签文本域中键入 Customer Name
10.	对于 TotalLow，在标签文本域中键入 Order Total Greater Than
11.	对于 TotalHigh，在标签文本域中键入 Order Total Lower Than 单击 Finish
12.	Applications Navigator 现在如下所示：

返回主题

返回主题列表

优化视图对象并更新应用程序模块

1.	在 Applications Navigator 中右键单击 SearchOrders 节点，并从上下文菜单中选择 Edit 选项。
2.	然后，添加一个格式掩码，以便 OrderTotal 显示为货币值。 展开 Attributes 节点，选择 OrderTotal，并在 Control Hints 选项卡中将 Format Type 设置为 Currency。 单击 OK。 注：由于格式是在视图对象级指定的，因此只有使用此特定视图定义的组件才会继承此格式定义。
3.	右键单击 Applications Navigator 中的 Orders 实体对象节点，并从上下文菜单中选择 Edit 选项。
4.	展开 Attributes 节点，选择 OrderDate，在 Control Hints 选项卡中将 Format Type 设置为 Simple Date，并指定以下格式： dd-MMM-yyyy 单击 OK。 注：由于格式是在实体对象级指定的，因此所有基于此实体定义的视图均继承此格式定义。
5.	在 Applications Navigator 中，右键单击 OrderEntryAM 并从上下文菜单中选择 Edit。
6.	您需要在应用程序模块的数据模型中包含新视图对象组件的实例。 在 Application Module Editor 中，选择 Data Model 节点，并在可用对象列表中选择 ModelLOV。单击 Add 按钮 ，将选择移入 Data Model 窗格中。 对 SearchOrders 和 PromotionsLOV 重复移入操作。 然后单击 OK。 注：Instance Name 域可用于更改数据模型中选定视图对象实例的名称。
7.	单击 JDeveloper 菜单栏上的 Save All 图标，或从菜单中选择 File > Save All。
8.	您现在已经自定义了 SearchOrders 视图来满足应用程序的特定需要。下一步是创建使用此数据模型的 JSF 页面。

返回主题

返回主题列表

创建搜索页面

在以下几个步骤中，您将使用刚刚定义的 SearchOrders 视图创建一个基于 ADF BC 模型的 ADF Faces 页面。

1.	在 Applications Navigator 中，折叠 DataModel 项目并展开 UserInterface 项目。双击 faces-config.xml 节点以打开图表。 注：或者，可以右键单击 UserInterface 节点，并从上下文菜单中选择 Open JSF Navigation 选项。
2.	从组件选项板中，将 JSF page 图标拖放到图表上。
3.	将页面重命名为 Search。 双击 JSF page 图标启动页面创建向导。
4.	选择新的 JSF 将打开 Create JSF JSP 向导。单击 Next 跳过 JSF JSP 向导的 Welcome 页面（如果显示该页面）。
5.	选择 JSP Page (*.JSP) 作为 Search.jsp 的类型。 接受其他默认值。 单击 Next 继续。
6.	在新页面 Component Binding 中，选择 Do Not Automatically Expose UI Components 选项。保留其他值的默认值。 单击 Next。
7.	确保选择了下列库： JSF Core 1.0 JSF HTML 1.0 ADF Faces Components ADF Faces HTML 单击 Next 接受这些库。
8.	单击 Finish 接受默认的 HTML 选项并创建新的 JSP。 您现在就创建了一个空的 Search.jsp 页面。 在以下几个步骤中，您将在该页面上添加 ADF Faces 数据绑定组件。 这些组件显示与选择条件匹配的行搜索条件。
9.	在 Data Control 选项板中，展开以下节点 OrderEntryAMDataControl > SearchOrders1 > Operations，并选择 ExecuteWithParams 操作。
10.	将 ExecuteWithParams 拖放到页面上，然后在上下文菜单中，选择 Create > Parameters > ADF Parameter Forms... Edit Form Fields 对话框打开。 单击 OK。 页面将显示在编辑器中。
11.	在 Data Control 选项板中，选择 SearchOrders1 并将其拖放到参数表单下。
12.	在新对话框中，选择 Create > Tables > ADF Read Only Table
13.	在 Edit Table Columns 对话框中，单击 Enable Selection 和 Enable Sorting 框 然后单击 OK。 您现在创建了一个数据绑定到 ADF BC 业务服务的完整 JSF 页面。
14.	单击工具栏中的绿色箭头 运行搜索页面。
15.	试用搜索页面，为 Customer Name、 Total Low 和 Total High 域指定值，然后单击 ExecuteWithParams 按钮。 注：客户名称搜索区分大小写，并根据在基础视图对象中指定 WHERE 子句的方式匹配名字或姓氏。在实际应用程序中，您可以使用属性查看器将 ExecuteWithParams 按钮轻松地重命名为“Find”或“Search”。
16.	尝试各种搜索组合。单击任意列的标题来测试排序工具。再次单击该标题将从升序切换为降序，反之亦然。完成 时关闭浏览器窗口。

返回主题列表

创建编辑页面

在以下几个步骤中，您将使用刚刚构建的 Orders、PromotionsLOV 和 ModelLOV 视图创建一个基于 ADF BC 模型的 ADF Faces 页面。

1.	在 Applications Navigator 中，双击 faces-config.xml 节点打开一个图表。
2.	从组件选项板中，将 JSF page 图标拖放到图表上。
3.	将页面重命名为 EditOrder。 双击 EditOrder JSF 页面图标启动该向导。
4.	选择新的 JSF 将打开 Create JSF JSP 向导。单击 Next 跳过 JSF JSP 向导的 Welcome 页面。
5.	JSP 标准支持创建格式良好的 XML 文档页面。这些页面非常方便，因为它们使您可以轻松地使用 XML 工具分析页面源代码，并且对于不将代码混合到页面中这个最佳实践起到促进作用。JDeveloper 支持使用 *.jsp 页面或这些基于 XML 的 *.jspx 页面。在该步骤，您将使用所谓的 JSP Document（基于 XML 的 JSP 页面样式）编辑页面。 选择 JSP Document (*.JSPX) 作为 EditOrder.jspx 的类型。接受其他默认值 单击 Next 继续。
6.	在下一个页面 Component Binding 中，选择 Do Not Automatically Expose UI Components 选项。保留其他值的默认值。 单击 Next。
7.	确保选择了下列库： JSF Core 1.0 JSF HTML 1.0 ADF Faces Components ADF Faces HTML 单击 Next 接受这些库。单击 Finish 接受默认 HTML 选项并创建新的 JSPX。
8.	您现在拥有了一个空的 EditOrder.jspx 页面。在以下几个步骤中，您将在该页面上添加一个 ADF Faces 数据绑定组件。这些组件使用各种 UI 表示显示 Orders 信息。
9.	在 Data Control 选项板中，展开 OrderEntryAMDataControl 节点并将 OrdersView1 拖放到该空页面上。
10.	在新对话框中，选择 Create > Forms > ADF Form...
11.	在 Edit Form Fields 中，删除 OrderMode 和 PromotionId 属性，然后选中 Include Submit Button。 单击 OK。
12.	从 Data Controls 选项板中，展开 OrdersView1 并将 OrderMode 属性拖放到页面上的 Order Total.label 域之后。 在上下文菜单中，选择 Create > Single Selections > ADF Select One Choice...
13.	在 List Binding Editor 中，选择 Dynamic List 选项。注意，在这个特定实例中，由于值的数量很少，因此还可以使用 Fixed List 选项，然后指定允许值的列表。 在 List Data Source 中，单击 Add 按钮，并在 Add Data Source Editor 中选择 ModelLOV1 数据控件，然后单击 OK。 将 Base Data Source 设置为 OrderMode，并将 List Data Source Attribute 设置为 Modevalue。 在 List Items 中，将显示属性设置为 Modevalue，然后在 No Selection Item 中，选择 Include Blank Item。 然后单击 OK。
14.	从 Data Controls 选项板中，选择 PromotionId 列，然后将 PromotionId 属性拖放到页面上的 OrderMode.label 域之后。 从上下文菜单中，选择 Create > Single Selections > ADF Select One Choice...
15.	在 List Binding Editor 中，选择 Dynamic List 选项。 在 List Data Source 中，单击 Add 按钮，然后在 Add Data Source Editor 中，选择 PromotionsLOV1 数据控件并单击 OK。 将 List Data Source Attribute 设置为 PromoId。在 List Items 部分中，将显示属性设置为 PromoName，并将 No Selection Item 设置为 Include Blank Item。 单击 OK。
16.	重新打开 faces-config 图表，然后在组件选项板中选择 JSF Navigation Case。单击 Search 页面，并绘制一条指向 EditOrder 页面的直线。
17.	在 Property 窗格中，将 From Outcome 设置为 edit 以重命名导航。
18.	在组件选项板中，选择 JSF Navigation Case。单击 EditOrder 页面并绘制一条指向 Search 页面的直线。
19.	在该图表上，为输出选择 success 标签，并将它的值更改为 search 以重命名输出导航。
20.	重新打开 EditOrder 页面，然后在 Data Control 选项板中，向下滚动到底部，打开 Operations 节点，然后将 Commit 操作拖放到现有的 Submit 按钮上。 在上下文菜单中，选择 Bind Existing CommandButton 选项。 在属性窗格中，对于 Commit 按钮，从下拉列表中将 action 值设置为 search。然后， 选择 Disabled 属性并单击 Reset to Default 图标以填充 false 值。这将使 commit 按钮始终可以选择。
21.	在 Data Controls 选项板的 Operations 节点中，将 Rollback 操作拖放到 Commit 按钮的旁边。 在上下文菜单中，选择 ADF Command Button 选项 在属性窗格中，对于 Rollback 按钮，从下拉列表中将 action 值设置为 search。然后，选择 Disabled 属性，并单击 Reset to Default 图标以填充 false 值。这将使 rollback 按钮始终可以选择。
22.	重新打开页面流图，双击图表上的 Search 图标打开 Search 页面，然后选择 Submit 按钮。
23.	在属性窗格中，键入 Edit 作为 Text 值，对于 Action，从下拉列表中选择 edit。
24.	重新打开 faces-config，然后选择并运行 Search 页面。
25.	在搜索页面中，选择一行然后单击 Edit 按钮。
26.	注意，编辑页面将被调用，但不显示搜索页面中的选定行。假设搜索页面和编辑页面均基于同一视图对象，则搜索页面中的选定行也将成为编辑页面中的当前行。但由于搜索页面和编辑页面基于不同的视图对象，因此某个页面中的当前行独立于另一个页面中的当前行。在下一个部分中，您将配置声明步骤，以使搜索页面中的当前选定行与要在编辑页面中编辑的当前行同步。 测试 OrderMode 和 PromotionId 属性上的下拉列表 注意， Orderdate 根据您前面在实体对象级别指定的格式显示，但 OrderTotal 并不像在搜索页面中那样显示货币格式，这是因为格式是在 SearchOrders 视图上而不是在 OrdersV1 视图上定义的。
27.	关闭浏览器，返回到 JDeveloper。

返回主题列表

同步搜索和编辑页面

现在，您必须使搜索页面中选择的信息与编辑页面上显示的信息同步。

使用搜索页面中的 Edit 按钮完成同步，将当前选中行的键指定给编辑页随后将访问的变量，以在显示该页之前设置它的当前行。

以下几个步骤引导您完成此过程。

1.	在 Desig 编辑器中打开 Search 页面，然后选择 Edit 按钮。
2.	ADF Faces 使您可以简单地采用声明方式通过单击链接或按钮自动设置某个应用程序变量的值。在该步骤中，我们将向搜索页面中的 Edit 按钮添加一个 SetActionListener 组件，以将变量设置为当前选定行的键值（唯一标识该行）。 在 Structure 窗格中，右键单击 edit commandButton，然后从上下文菜单中选择 Insert Inside > ADF Faces Core > SetActionListener
3.	在 Insert SetActionListener 对话框中，输入下列值： From #{row.rowKeyStr} To #{processScope.orderKey} 单击 OK。 注：我们使用标准 JSF 表达式语言 (EL) 语法指定 SetActionListener 的 From 和 To 属性。运行时将计算 From 表达式，然后使用该值设置由 To 表达式标识的属性。 #{row.rowKeyStr} 表达式引用表的当前行上名为 rowKeyStr 的属性。它的值将是一个表示该行的唯一键。 #{processScope.orderKey} 表达式引用 ADF Faces 进程作用域中名为“orderKey”的属性。该进程作用域保存这样的属性：其值的持续时间超过单个请求（当某个页面使用重定向而非前进导航到另一个页面便可能存在这种情况）的属性，或其值应 局限于一组给定相关网页的属性。“orderKey”是本文指定的一个名称，用于清楚地表明该属性保存当前选定顺序的键。
4.	在以下几个步骤中，您将配置编辑页面，以便在使用 ADF 模型层为所有页面提供的内置 setCurrentRowWithKey 操作初次显示页面时，以声明方式设置当前要编辑的行。这是在页面的数据绑定元数据（存储在每个页面的 ADF 页面定义中）中配置的。 在 Applications Navigator 中，右键单击 EditOrder 页面节点。从上下文菜单中，选择 Go to Page Definition 选项
5.	然后，添加 OrdersView1Iterator 的 setCurrentRowWithKey 操作绑定。该迭代器是我们最初从 Data Control 选项板拖放 ADF Form 时在页面定义中自动创建的。迭代器跟踪基础数据源中的当前行，并提供在构建用户界面（如 Next、Previous、setCurrentRowWithKey 等）时有用的各种内置操作。 右键单击 bindings 节点。从上下文菜单中，选择 Insert Inside bindings > action
6.	在 Action Binding Editor 的 Select an Iterator 域中，从对话框底部的下拉列表中选择 OrdersView1Iterator。
7.	在 Select an Action 的下拉列表中选择 setCurrentRowWithKey，并在 Value 域中双击。然后输入以下值： #{processScope.orderKey} 然后，单击 OK。 注：内置的 setCurrentRowWithKey 操作采用一个名为“rowKey”的参数，该参数表示当前行的键。上一步骤中，我们配置了搜索页面的 Edit 按钮，以将当前行的键存储在 ADF Faces 进程作用域中名为“orderKey”的属性中。因此，我们在此处需要以参数形式将该行键值传递给 setCurrentRowWithKey 操作。为此，我们只需使用同一 EL 表达式作为参数的值：#{processScope.orderKey}。
8.	单击 JDeveloper 菜单栏上的 Save All 图标，或从菜单中选择 File > Save All。
9.	在 Structure 窗格中，右键单击 executables 节点，然后从上下文菜单中选择 Insert inside executables > invokeAction 选项
10.	在收到指示之前，页面定义中的操作绑定将不执行它的操作。可以通过三种方法调用操作绑定： 1. 可以通过编写代码以编程方式调用； 2. 可以通过用户单击页面中的按钮或链接以声明方式调用； 3. 可以在呈现页面时以声明方式进行调用，而不需要用户单击任何内容 在本例中，我们希望在加载页面时自动执行 setCurrentRowWithKey 操作，因此我们将在页面定义的“executables”部分配置一个 invokeAction 指示，以便通过声明方式达到目的。 在 Insert InvokeAction 对话框中，输入以下值： Id setCurrentRowFromOrderId Binds setCurrentRowWithKey （从下拉列表中） 注：Id 名称可以由开发人员根据喜好自行定义。 单击 Advanced Properties 选项卡。 注：默认情况下，“invokeAction”将在每次呈现页面时执行。这包括当页面最初呈现时，以及在处理随后的“postback”事件时，例如在用户与页面上的按钮或链接交互时。我们可以使用布尔值 EL 表达式指定一个可选 RefreshCondition，以便以声明方式配置 invokeAction 应何时“引发”。当表达式计算为 true 时，invokeAction 将调用其相关操作绑定。当表达式计算为 false 时，将跳过 invokeAction，不调用相关的操作绑定。 由于我们只希望最初呈现页面（而不是在以后处理 postback 事件）时触发 setCurrentRowWithKey 操作，因此可以使用 EL 表达式 #{adfFacesContext.postback == false} 完成该操作。最初呈现页面时，该 postback 属性将为 false。 输入下列值： Refresh ifNeeded Refresh Condition ${adfFacesContext.postback==false} 单击 OK。
11.	选择 Search 页面并 Run（运行）该页面
12.	在搜索页面中指定搜索参数，然后单击 ExecuteWithParams 按钮执行查询。在详细信息列表中，选择一行，然后单击 Edit 按钮调用 EditOrder 页面。
13.	在 EditOrder 页面中，更改 OrderTotal 值并 提交更改。
14.	搜索页面现在重新显示原始搜索请求的行。该页面还反映了以前进行的更新。
	学得很好！您已经成功完成了此 OBE。

返回主题列表

总结

在本教程中，您使用 Oracle JDeveloper、ADF 业务组件和 ADF Faces 构建了一个端到端应用程序。您 学习了如何：

	创建 ADF 业务组件模型
	使用 ADF Faces 组件创建一个 JavaServer Faces 页面
	使用 ADF 业务组件自定义 UI 的元素
	运行和测试 ADF Faces 应用程序
	使用业务组件控制提示自定义应用程序
	为 LOV 和验证控件创建新业务组件
	基于连接操作创建一个搜索页面
	创建一个编辑页面
	当编辑页面和搜索页面 基于不同的视图对象时同步这两个页面

返回主题列表

将鼠标置于该图标上可以隐藏所有的屏幕截图。