NetBeans可视化Web开发之数据库应用开发

第9章 数据库操作

本章学习目标：

l 掌握NetBeans中数据库应用开发的基本过程；

l 掌握NetBeans中数据库常用操作的实现。

主要内容：

l 创建应用需要的数据库表；

l 通过可视化界面显示数据库表中所有的信息；

l 在此基础上对这些信息进行修改和删除；

l 实现添加功能；

l 根据条件查询信息；

l 使用MySQL数据库作为应用数据库。

9.1 准备工作

<chsdate w:st="on" isrocdate="False" islunardate="False" day="30" month="12" year="1899"><span lang="EN-US"><font face="Times New Roman">9.1.1</font></span></chsdate>目标

使用NetBeans自带的数据库管理系统创建后续章节将要使用的数据库，数据库的名字为jsfdb，然后在该数据库中物品表goods，并添加测试数据。

<chsdate w:st="on" isrocdate="False" islunardate="False" day="30" month="12" year="1899"><span lang="EN-US"><font face="Times New Roman">9.1.2</font></span></chsdate>跟着我操作

1）创建数据库

主菜单中选择：【Tools】à【Java DB Database】à【Create Database】。

在弹出的界面中，设置数据库的名字为“jsfdb”，用户名为“jsf”，口令为“jsf”，如图所示，然后点击【OK】。

<shapetype id="_x0000_t75" stroked="f" filled="f" path="m@4@5l@4@11@9@11@9@5xe" o:preferrelative="t" o:spt="75" coordsize="21600,21600"><stroke joinstyle="miter"></stroke><formulas><f eqn="if lineDrawn pixelLineWidth 0"></f><f eqn="sum @0 1 0"></f><f eqn="sum 0 0 @1"></f><f eqn="prod @2 1 2"></f><f eqn="prod @3 21600 pixelWidth"></f><f eqn="prod @3 21600 pixelHeight"></f><f eqn="sum @0 0 1"></f><f eqn="prod @6 1 2"></f><f eqn="prod @7 21600 pixelWidth"></f><f eqn="sum @8 21600 0"></f><f eqn="prod @7 21600 pixelHeight"></f><f eqn="sum @10 21600 0"></f></formulas><path o:connecttype="rect" gradientshapeok="t" o:extrusionok="f"></path><lock aspectratio="t" v:ext="edit"></lock></shapetype><shape id="_x0000_i1025" style="WIDTH: 261pt; HEIGHT: 123.75pt" type="#_x0000_t75"><imagedata o:title="创建数据库" src="file:///C:%5CDOCUME~1%5CADMINI~1%5CLOCALS~1%5CTemp%5Cmsohtml1%5C01%5Cclip_image001.png"></imagedata></shape>

图9.1 创建数据库

2）连接数据库

在Service下面的Databases下面可以看到已经建立好的到数据库jsfdb的连接，连接的名字为：jdbc:derby://localhost:1527/jsfdb。在该连接上点击右键，可以通过【Properties】察看属性。要连接到这个数据库，在这个URL上点击右键，选择【Connect…】即可。如图所示：

<shape id="_x0000_i1026" style="WIDTH: 279.75pt; HEIGHT: 182.25pt" type="#_x0000_t75"><imagedata o:title="连接数据库" src="file:///C:%5CDOCUME~1%5CADMINI~1%5CLOCALS~1%5CTemp%5Cmsohtml1%5C01%5Cclip_image003.png"><font size="3"></font></imagedata></shape>

图9.2 连接数据库

数据库连接之后，可以看到有3个字文件夹，分别是Tables、Views和Procedures。现在全部为空。

3）创建数据表

可以通过两种方式创建表：可视化方法和命令行方式（写SQL语句）。

可视化创建表的过程：在“Tables”上面点击右键，然后选择【Create Table…】，然后在弹出的表设计界面中设计表，这个过程可以自行完成，不再介绍。

通过命令行的方式创建表：在“Tables”上点击右键，然后选择【Execute Command…】，

在右边的界面中输入创建表的语句：

create table goods

(

goodid varchar(10) primary key,

goodname varchar(20) not null,

price float

)

在下面的【output】窗口中显示执行成功。执行成功之后看不到创建的表，需要在“Tables”上点击右键，选择【Refresh】，就可以看到创建的表。如图所示：

<shape id="_x0000_i1027" style="WIDTH: 307.5pt; HEIGHT: 230.25pt" type="#_x0000_t75"><imagedata o:title="创建表" src="file:///C:%5CDOCUME~1%5CADMINI~1%5CLOCALS~1%5CTemp%5Cmsohtml1%5C01%5Cclip_image005.png"><font size="3"></font></imagedata></shape>

图9.3 创建表

4）插入测试数据

在命令行窗口中继续执行下面的SQL语句：

insert into goods values('0011002200','洗衣粉',18);

insert into goods values('0011002201','香皂',3.5);

insert into goods values('0011003300','香油',10);

insert into goods values('0011003301','酱油',2.8);

insert into goods values('0011004400','花生',11);

insert into goods values('0011004401','瓜子',5);

insert into goods values('0011005500','面粉',23);

insert into goods values('0011005501','大米',17);

5）察看数据

在表GOODS上面点击右键，选择【View Data】，即可查看数据。

9.2 显示所有数据

<chsdate w:st="on" isrocdate="False" islunardate="False" day="30" month="12" year="1899"><span lang="EN-US">9.2.1</span></chsdate> 目标

把物品表中的信息显示在界面上。

<chsdate w:st="on" isrocdate="False" islunardate="False" day="30" month="12" year="1899"><span lang="EN-US">9.2.2</span></chsdate> 跟着我操作

1）创建工程

创建可视化Web应用，应用的名字为：dbtest。

2）创建JSF页面

使用创建Web应用时候生成的JSF页面Page1.jsp作为显示信息的界面。

3）向页面添加组件

u 在页面的上方添加一个Label控件，然后输入“物品信息列表”。

u 在标签的下面添加Table控件。

4）连接到数据库

在Runtime窗口中，选择配置好的要连接的数据库URL，展开这个连接，如果不能展开，说明还没有连接，先建立连接，可以参考前面介绍的连接数据库。

u 展开Databases节点；

u 展开Tables节点；

u 选择Goods表；

u 然后把表Goods表拖到表格上；

之后的界面如图所示：

<shape id="_x0000_i1028" style="WIDTH: 268.5pt; HEIGHT: 168pt" type="#_x0000_t75"><imagedata o:title="物品设计界面" src="file:///C:%5CDOCUME~1%5CADMINI~1%5CLOCALS~1%5CTemp%5Cmsohtml1%5C01%5Cclip_image007.png"><font size="3"></font></imagedata></shape>

图9.4 物品信息列表设计界面

5）运行程序

在工程上点击右键，选择【Run】。这时候IDE会完成如下工作：

启动服务器；

把应用部署到服务器上；

启动浏览器，访问服务器上的应用。

运行效果如下：

<shape id="_x0000_i1029" style="WIDTH: 289.5pt; HEIGHT: 237.75pt" type="#_x0000_t75"><imagedata o:title="物品列表运行结果" src="file:///C:%5CDOCUME~1%5CADMINI~1%5CLOCALS~1%5CTemp%5Cmsohtml1%5C01%5Cclip_image009.png"></imagedata></shape>

图9.5 运行结果

【试一下】点击表头的GOODID、GOODNAME和PRICE，看看有什么变化？

<chsdate w:st="on" isrocdate="False" islunardate="False" day="30" month="12" year="1899"><span lang="EN-US"><font face="Times New Roman">9.2.3</font></span></chsdate>告诉您为什么

1）在图4中的列表中abc和123.0表示什么

在设计界面上，列表中会显示abc，这个abc表示显示的信息与一个String对象关联，在这种情况下，与SQL类型为varchar的数据库列对应。同样123.0表示显示的信息与一个Double对象关联。

2）Table组件如何与数据库表关联

IDE为数据库表添加了一个不可见的组件goodsDataProvider组件，这个组件在Navigator窗口中可以看到。同时IDE在SessionBean1中添加了一个属性goodsRowSet。

goodsRowSet属性保存了从数据库中得到的物品信息，连接数据库并封装数据的过程由IDE生成的代码完成，开发人员不需要关心，如果想修改查询结果，只要对SQL语句进行修改即可。在Navigator窗口中，选择SessionBean1下面的goodsRowSet，然后点击右键，在弹出式菜单中选择【Edit SQL Statement】，如图所示：

<shape id="_x0000_i1030" style="WIDTH: 192pt; HEIGHT: 228pt" type="#_x0000_t75"><imagedata o:title="修改SQL语句" src="file:///C:%5CDOCUME~1%5CADMINI~1%5CLOCALS~1%5CTemp%5Cmsohtml1%5C01%5Cclip_image011.png"></imagedata></shape>

图9.6 选择编辑SQL语句

之后弹出如图所示的界面：

<shape id="_x0000_i1031" style="WIDTH: 327.75pt; HEIGHT: 228pt" type="#_x0000_t75"><imagedata o:title="编辑SQL语句" src="file:///C:%5CDOCUME~1%5CADMINI~1%5CLOCALS~1%5CTemp%5Cmsohtml1%5C01%5Cclip_image013.png"></imagedata></shape>

图9.7 SQL编辑区

上面显示了表的结构，中间部分显示的是SQL语句的可视化设计界面，下面部分是SQL语句的代码编辑区。

goodsDataProvider是数据提供者，与SessionBean1中的goodsRowSet相关联，可以通过下面的方式查看。

在navigator窗口中选择Page1下的GoodsDataProvider，然后在右边的属性窗口中可以查看GoodsDataProvider属性，如下图，cachedRowSet的值就是前面介绍的SessionBean1中的goodsRowSet。

<shape id="_x0000_i1033" style="WIDTH: 163.5pt; HEIGHT: 111pt" type="#_x0000_t75"><imagedata o:title="数据提供者属性" src="file:///C:%5CDOCUME~1%5CADMINI~1%5CLOCALS~1%5CTemp%5Cmsohtml1%5C01%5Cclip_image015.png"><font size="3"></font></imagedata></shape>

图9.8 数据提供者与行集的关联

Table组件与goodsDataProvider数据提供者关联。右键点击Table组件，在弹出式菜单中选择Bind to Data，会显示Bind to Data对话框，如下图所示：

<shape id="_x0000_i1034" style="WIDTH: 220.5pt; HEIGHT: 162pt" type="#_x0000_t75"><imagedata o:title="Bind to data对话框" src="file:///C:%5CDOCUME~1%5CADMINI~1%5CLOCALS~1%5CTemp%5Cmsohtml1%5C01%5Cclip_image017.png"><font size="3"></font></imagedata></shape>

图9.9 数据绑定对话框

Table组件具体显示什么数据，可以在Table上点击右键，选择【Table Layout】，弹出如图所示界面：

<shape id="_x0000_i1035" style="WIDTH: 191.25pt; HEIGHT: 249pt" type="#_x0000_t75"><imagedata o:title="Tble Layout" src="file:///C:%5CDOCUME~1%5CADMINI~1%5CLOCALS~1%5CTemp%5Cmsohtml1%5C01%5Cclip_image019.png"></imagedata></shape>

图9.10 Table Layout界面

可以通过Available和Selected列表框中间的左右箭头选择要显示那些列的信息。如果希望修改某一列的相关属性，可以先在Selected列表框中选中该列，然后修改下面的属性。

3）系统如何访问数据库

在工程的Server Resources下面的sun-resources.xml中有连接池和数据源的配置代码：

<jdbc-resource enabled="true" jndi-name="jdbc/JSF_ApacheDerby" object-type="user" pool-name="derby_netPool"/>

<jdbc-connection-pool

allow-non-component-callers="false"

associate-with-thread="false"

connection-creation-retry-attempts="0"

connection-creation-retry-interval-in-seconds="10"

connection-leak-reclaim="false"

connection-leak-timeout-in-seconds="0"

connection-validation-method="auto-commit"

datasource-classname="org.apache.derby.jdbc.ClientDataSource"

fail-all-connections="false"

idle-timeout-in-seconds="300"

is-connection-validation-required="false"

is-isolation-level-guaranteed="true"

lazy-connection-association="false"

lazy-connection-enlistment="false"

match-connections="false"

max-connection-usage-count="0"

max-pool-size="32"

max-wait-time-in-millis="60000"

name="derby_netPool"

non-transactional-connections="false"

pool-resize-quantity="2"

res-type="javax.sql.DataSource"

statement-timeout-in-seconds="-1"

steady-pool-size="8"

validate-atmost-once-period-in-seconds="0"

wrap-jdbc-objects="false">

<property name="serverName" value="localhost"/>

<property name="PortNumber" value="1527"/>

<property name="DatabaseName" value="jsfdb"/>

<property name="User" value="jsf"/>

<property name="Password" value="jsf"/>

</jdbc-connection-pool>

在工程的web.xml中有如下的代码：

<resource-ref>

<description>Creator generated DataSource Reference</description>

<res-ref-name>jdbc/JSF_ApacheDerby</res-ref-name>

<res-type>javax.sql.DataSource</res-type>

<res-auth>Container</res-auth>

</resource-ref>

goodsRowSet对象访问上面的数据源。在SessinBean1中，会看到_init方法中有如下的代码：

goodsRowSet.setDataSourceName("java:comp/env/jdbc/JSF_ApacheDerby");

goodsRowSet.setCommand("SELECT * FROM JSF.GOODS");

goodsRowSet.setTableName("GOODS");

9.3 完成添加功能

<chsdate w:st="on" isrocdate="False" islunardate="False" day="30" month="12" year="1899"><span lang="EN-US"><font face="Times New Roman">9.3.1</font></span></chsdate>目标

本节的目标如下：

l 能够通过界面向数据库中添加信息；

l 能够通过界面修改数据库中的信息；

l 能够撤销这些修改。

<chsdate w:st="on" isrocdate="False" islunardate="False" day="30" month="12" year="1899"><span lang="EN-US"><font face="Times New Roman">9.3.2</font></span></chsdate>跟着我操作

1）编写界面

在界面上添加一个按钮，输入“添加物品”，当点击这个按钮的时候会在表格下面添加一行。

然后界面上再添加一个按钮，输入“保存修改”，当点击这个按钮的时候系统会保存修改后的信息。

2）修改Table中的元素

Table中原来显示信息使用静态文本，现在需要修改成输入框以便使用。

在Table上点击右键，选择【Table Layout】，在弹出的界面上选择Selected列表框中的GOODS.GOODID，然后修改下面的Component Type属性后的下拉框，选择“Text Field”。

采用同样的方法修改另外两个属性。

3）创建虚拟表单

按住Ctrl键，选择表格中最上面的3个输入框。然后在任意输入框上右键点击，在弹出式菜单中选择【Configure Virtual Forms...】，出现下面的界面：

<shape id="_x0000_i1036" style="WIDTH: 291pt; HEIGHT: 173.25pt" type="#_x0000_t75"><imagedata o:title="配置虚拟表单" src="file:///C:%5CDOCUME~1%5CADMINI~1%5CLOCALS~1%5CTemp%5Cmsohtml1%5C01%5Cclip_image021.png"></imagedata></shape>

图9.11 编辑虚拟表单

把Name修改为“save”，选择Participate为Yes，然后点击【OK】即可。

4）为“添加物品”按钮添加动作

当点击“添加物品”按钮的时候，会在Table的下面添加一行。添加动作的过程如下：

点击“添加物品”按钮，IDE会打开源代码并生成button1_action方法；

修改方法如下（粗体为添加部分）：

public String button1_action() {

try {

RowKey rk = goodsDataProvider.appendRow();

goodsDataProvider.setCursorRow(rk);

} catch (Exception ex) {

log("Error Description", ex);

error(ex.getMessage());

}

return null;

}

5）为“保存修改”按钮添加动作

当点击“保存修改”按钮的时候，会把用户的修改更新到数据库中。添加处理代码的过程如下：

点击“保存修改”按钮，IDE会打开源代码并生成button2_action方法；

修改方法代码如下（粗体为添加部分）：

public String button2_action() {

try {

goodsDataProvider.commitChanges();

} catch (Exception ex) {

log("Error Description", ex);

error("Error :"+ex.getMessage());

}

return null;

}

6）运行测试

7）取消操作

l 在界面上添加一个按钮；

l 修改按钮的内容为“取消改变”；

l 把按钮的id属性修改为“cancle”；

l 双击该按钮，生成action事件；

l 为事件添加处理代码：

public String revert_action() {

form1.discardSubmittedValues("save");

try {

goodsDataProvider.refresh();

} catch (Exception ex) {

log("Error Description", ex);

error(ex.getMessage());

}

return null;

}

<chsdate w:st="on" isrocdate="False" islunardate="False" day="30" month="12" year="1899"><span lang="EN-US"><font face="Times New Roman">9.3.3</font></span></chsdate>告诉您为什么

1）修改功能是如何实现的

通过前面的介绍，修改功能的操作过程为：修改表格中的某一行，然后点击“保存修改”即可完成，该功能是如何实现的呢？

表格中的数据与goodsDataProvider关联，当修改表格中的数据之后，修改后的数据也会映射到goodsDataProvider；

当点击“保存修改”的时候，调用了goodsDataProvider的commitChanges方法；

该方法能够调用goodsRowSet的相应方法完成对数据库中数据的更新。

2）添加功能是如何实现的

添加功能与修改功能的实现非常类似，只是需要先在表格中添加一行，通过下面的代码添加：

RowKey rk = goodsDataProvider.appendRow();

3）撤销功能是如何实现的

不管是添加功能还是修改功能，用户操作完之后，都需要通过goodsDataProvider对象的commitChanges方法完成提交。如果不提交，这些修改不会影响到goodsRowSet对象。

如果不想要这些修改，可以调用goodsDataProvider的refresh方法进行刷新，会从goodsRowSet中重新加载数据，这样用户在表格中所作的修改就撤销了。

9.4 完成删除功能

<chsdate w:st="on" isrocdate="False" islunardate="False" day="30" month="12" year="1899"><span lang="EN-US"><font face="Times New Roman">9.4.1</font></span></chsdate>目标

在信息列表界面中，当用户选择某个记录后面的删除按钮的时候，可以删除当前记录。

<chsdate w:st="on" isrocdate="False" islunardate="False" day="30" month="12" year="1899"><span lang="EN-US">9.4.2</span></chsdate> 跟着我操作

1）修改界面

首先在表格的每一行添加一个删除按钮，操作过程如下：

l 在Table上点击右键，选择Table Layout；

l 点击New按钮添加一列；

l 选中该列；

l 修改该列的相关信息，如图12所示；

l 点击OK即可。

<shape id="_x0000_i1037" style="WIDTH: 192pt; HEIGHT: 249pt" type="#_x0000_t75"><imagedata o:title="添加删除按钮" src="file:///C:%5CDOCUME~1%5CADMINI~1%5CLOCALS~1%5CTemp%5Cmsohtml1%5C01%5Cclip_image023.png"><font size="3"></font></imagedata></shape>

图9.12 为表格添加列

2）为删除按钮添加事件

双击表格中的删除按钮生成事件方法；

添加事件处理代码：

public String delete_action() {