在此演练中，您将在 Sun Java™ Studio Creator 应用程序开发环境 (IDE) 中创建和部署一个简单的 Web 应用程序
"travel center"。向页面中添加两个组件，并将那些数据识别组件绑定到本地数据库。然后，生成应用程序并将其
部署到本地应用服务器，在客户机 Web 浏览器上运行该应用程序。
内容
• 创建项目
• 添加 Dropdown List 组件
• 将组件连接到数据库
• 运行 Web 应用程序
• 添加 Data Table
• 修改 SQL 查询
• 控制显示的行
要完成此演练，系统上应该已经安装了 IDE，并且您已经阅读了 Java Studio Creator 入门 教程。
创建项目
开发 Web 应用程序从创建项目开始。就像在入门教程中学习的那样，项目是 IDE 中的基本工作单元。项目包含
组成应用程序的所有源代码和资源。
1. 在“欢迎”屏幕上单击“创建新项目”。
2. 在“新建项目”对话框的“名称”文本字段中，键入 TravelCenter。
3. 选择“缺省 J2EE Web 应用程序”模板（如果尚未选定），然后单击“确定”。
通过这些步骤会创建两个重要的文件，在本教程的其他部分中也将用到这两个文件。
• Page1.jsp－JavaServer Pages™ 中包含组成 Web 应用程序的组件。最初，在应用程序中只有一个 JSP™
页，但是随后您可以添加更多的页面。
• Page1.java－包含页面状态并使其在不同的呈现中保持一致的 JavaBeans™ Bean。缺省情况下代码是不
可见的，但是您可以通过右键单击页面，然后在上下文菜单中选择“查看 Page1 Java 类”来显示它。
添加 Dropdown List 组件
接下来，向页面中添加 Dropdown List 组件。
1. 在组件面板中，选择“JSF”>“JSF 标准组件”，然后将 Dropdown List 组件拖到页面上。
Dropdown List 组件将出现在 Page1.jsp 页面上。您可以通过使用选择句柄来调整组件的大小，也可以
1
Sun Java Studio Creator
将组件移动到新位置。
2. 右键单击页面背景，然后在上下文菜单中选择“查看 Page1 Java 类”。
会在源编辑器中打开页面的 JavaBeans 源代码。
3. 在“选择类成员”下拉列表中选择 "dropdown1" 以导航到实例变量声明。（“选择类成员”下拉列表位于
源编辑器工具栏中。）
初始化 Dropdown List 组件的 Java 代码已添加到 Page1 类实现。
private HtmlSelectOneMenu dropdown1 = new HtmlSelectOneMenu();
将组件连接到数据库
在此部分中，使 Dropdown List 组件可以从数据库表获得项。
1. 单击源编辑器顶部的 Page1.jsp 标签以查看页面。
2. 从“服务器导航”中，将“数据源”> "Travel" >“表”> "PERSON" 节点拖放到 Dropdown List 组件的上
面。
将出现一个对话框，且 personRowSet 已添加到非可视组件托盘中。
注如果 PointBase Embedded 数据库没有运行，则您将看到一个“错误”对话框，告诉您这一情况。如果看
到此对话框，请关闭“错误”对话框，在“服务器导航”中右键单击“PointBase 数据库服务器”节点，
然后在上下文菜单中选择“启动 PointBase”。然后，右键单击“数据源”>
"Travel"，并从上下文菜单中选择 “刷新”。现在，您应该能够定位到 "Travel" 数据源节点。
3. 单击“填充列表”。
因为 PERSON.NAME 列属于 SQL 类型 varchar，在 Dropdown List 组件中将显示文本 "abc"，指示所显
示的数据是一个字符串。
注如果没看到这个对话框，是因为 PERSON 节点没有被直接放到 Dropdown List 组件的上面。在这种情况
下，在执行下一步时，请确保如图 1 所示选定了 PERSON.PERSONID 和 PERSON.NAME 列。
4. 右键单击 Dropdown List 组件，然后从上下文菜单中选择“从数据库填充列表”。
“值字段”被绑定到 PERSON.PERSONID 列，该列是 PERSON 表的主键。此字段提供由 JSF 组件的
getValue() 方法返回的值。另一方面，“显示字段”被绑定到 PERSON.NAME 列，是组件运行时所显
示的内容。
5. 单击“确定”。
运行 Web 应用程序
现在，您可以部署和运行 Web 应用程序了。IDE 附带有一个已经安装的本地部署服务器：
• Sun Java™ System Application Server Platform Edition 8
部署服务器是作为“服务器导航”中“部署服务器”节点下的一个节点安装的。通过部署服务器的上下文菜单
（可通过右键单击它进行访问），可以启动或停止它。
部署和运行 Web 应用程序
1. 单击工具栏中的“全部保存”按钮。
2. 单击工具栏中的“运行项目”按钮。
IDE 将生成、部署和运行 TravelCenter 应用程序。首先，“生成输出”窗口出现在 IDE 布局的底部。有关
编译的信息和部署准备将输出到此窗口。（如果在生成时出现问题，请首先检查“生成输出”窗口。）接
下来，将打开一个对话框，其中显示部署的状态。
部署之后，将使用 URL
http://localhost:18080/travelcenter/ 为应用程序打开一个新的 Web 浏览器
窗口。使用 PERSON 表的 NAME 列中的数据填充下拉列表。
添加 Data Table
接下来，向应用程序中添加一个 Data Table 组件，并将该组件与数据库表相连。
1. 在组件面板中，单击“JSF 标准组件”，将 Data Table 拖至页面，并将它放置在 Dropdown List 组件的下
面。
2. 拖动“数据源”> "Travel" >“表”> "TRIP" 节点，并将其放在 Data Table 上。确保整个 Data Table 组件的轮
廓为蓝色时放置节点。如果只有列或列标题的轮廓为蓝色，请将节点在组件内四处移动，直到整个组件的
轮廓为蓝色。
如果将节点放在列或列标题上，会出现“选择目标”对话框，而且 tripRowSet 已添加到非可视组件托
盘中。确保选中了 "dataTable1" 单选按钮，然后单击“确定”关闭对话框。
3. 右键单击 Data Table 组件，然后选择“表布局”。
注如果没有选定 Data Table 组件，或者选定了它的其中一个子组件（在本例中是列），则在右键单击 Data
Table 时，将出现另外的上下文菜单。在这种情况下，请选择 "dataTable1" >“表布局”。您可以按 Esc
键选择当前所选组件的父组件。
出现“表布局”对话框。这两个列表表明哪些列可用于显示以及正在显示哪些内容。将 TRIP 表放在 Data
Table 组件上时，将选择所有可用的列进行显示。
4. 选择“显示”列表中的第一列 (TRIP.TRIPID)，然后单击 "<" 按钮。
将从“显示”列表中移除该列。
5. 移除 TRIP.PERSONID 和 TRIP.TRIPTYPEID 列。
仍然出现在“显示”列表中的三列：
• TRIP.DEPDATE
• TRIP.DEPCITY
• TRIP.DESTCITY
使用数据绑定组件访问数据库 ▪
Sun Java Studio Creator
6. 单击“确定”。
现在，Data Table 组件中有三个显示列。
修改 SQL 查询
在此部分中，将修改 TRIP 行集对象中的 SQL 查询，以便查询返回 TRIPTYPE 表中的数据。您还将修改 Data
Table 组件以显示新列。
1. 右键单击非可视组件托盘中的 tripRowSet，然后选择“编辑行集查询”。
在编辑器窗格中将出现查询编辑器。标签的名称是 tripRowSet。
2. 右键单击设计视图（见图 4），然后选择“添加表”。
3. 选择 TRAVEL.TRIPTYPE 表，然后单击“确定”。
将出现另一个表格图，在两个表格图之间有一个链接。
4. 在指示的表中取消选中以下复选框：
• TRIP 表中的 TRIPID
• 两个表中的 TRIPTYPEID
会从结果集中删除上述列。同时会修改源视图中的 SQL 查询以反映这些更改。
4 使用数据绑定组件访问数据库 ▪
图 2 显示的列
图 3 第 1 列处于选定状态的 Data Table
Sun Java Studio Creator
5. 选择 Page1.jsp 标签以返回到可视编辑器。
6. 右键单击 Data Table，然后选择“表布局”。
将出现“表布局”对话框。由于您已经更改了行集的 SQL 查询，因此有更多可以显示的列。
7. 将 TRIPTYPE.DESCRIPTION 列添加到“显示”列表中。
8. 单击“确定”。
第四列将出现在 Data Table 组件中。
控制显示的行
在上一部分中将 TRIP 表放在 Data Table 组件上时，IDE 使用返回表中所有列的所有行的 SQL 查询创建了一个
行集对象。如果此时部署应用程序，则数据表将包含 TRIP 表中的所有行程信息。
假定您仅希望显示其名字出现在 Dropdown List 组件中人员的行程信息。您必须通过编辑 TRIP 行集对象的缺省查
询，在 Dropdown List 组件和 Data Table 组件之间创建主从关系 (Master-Detail)。
1. 双击 tripRowSet 对象打开查询编辑器。
2. 在查询编辑器的设计网格（电子表格）中，右键单击设计网格 PERSONID 行中的“条件”单元格，然后
选择“添加查询条件”。
使用数据绑定组件访问数据库 ▪
图 4 查询编辑器
设计视图
设计网格
源代码
Sun Java Studio Creator
3. 将“比较”下拉菜单设置为“=等于”，并选择“参数”单选按钮。
4. 单击“确定”。
在 PERSONID 的“条件”列中您会看到 "=?"，它在 SQL 查询中添加了以下 WHERE 子句：
WHERE TRAVEL.TRIP.PERSONID = ?
5. 通过选择 Page1.jsp 标签，返回到可视编辑器，然后双击 Dropdown List 组件。
Page1 类的源代码在编辑器区域中打开，且光标位于 dropdown1_processValueChange() 方法主体
内。此事件处理程序方法存根 (Stub) 是在您首次双击 Dropdown List 组件时创建的。
6. 从“组件面板”>“代码片段”>“演示”拖动 Travel dropdown 代码片段，将其放在
dropdown1_processValueChange() 方法体中。
6 使用数据绑定组件访问数据库 ▪
图 5 “添加查询条件”对话框
Sun Java Studio Creator
public void dropdown1_processValueChange(ValueChangeEvent vce) {
// User event code here...
try {
dataTable1Model.setObject(1, dropdown1.getValue());
dataTable1Model.execute();
} catch (Exception e) {
log("person change exception", e);
error(“Exception changing person id:”+e);
} // end try catch
}
这段代码将下拉列表的值绑定到为 dataTable1Model 准备的 SQL 语句中的参数上。
7. 在 Page1 类中找到 Page1() 构造函数。
8. 从“组件面板”>“代码片段”>“演示”拖动 Travel initialization 代码片段，并将其放在 Page1() 构造
函数实现的结尾处。
public Page1() {
// other lines of code omitted
catch ( Exception e) {
log("Page1 Initialization Failure", e);
throw new FacesException(e);
}
// Additional user provided initialization code
try {
personRowSet.execute();
personRowSet.next();
dataTable1Model.setObject(1, personRowSet.getObject("PERSONID"));
} catch (Exception ex) {
throw new FacesException(ex);
} // end try catch
}
这段代码将把下拉列表中当前选定 NAME 的 PERSONID 值绑定到为 dataTable1Model 准备的 SQL 语句
中的参数上。
9. 通过选择 Page1.jsp 标签返回到可视编辑器。
10.右键单击 Dropdown List 组件，然后选择“更改时自动提交”。
在属性表单中，以下代码将出现在 "Javascript" > "onchange" 属性中：
this.form.submit();
现在，当用户在运行的 Web 应用程序中更改下拉列表选择时，将重新提交和更新页面。
11.单击工具栏上的“全部保存”。
12.单击工具栏上的“运行项目”。
将重新生成和部署 Web 应用程序。在下拉列表中选择另一个名字，您会注意到更新了数据表。
使用数据绑定组件访问数据库 ▪ 2004 6 年月 7
Sun Java Studio Creator
请参见
• Java Studio Creator 入门
本文下载地址： http://mail.yl.gov.cn/ftp/yy/jscb2005.rar