当前位置:Gxlcms > mysql > NetBeans下构建操作数据库行的Web应用程序(二)

NetBeans下构建操作数据库行的Web应用程序(二)

时间:2021-07-01 10:21:17 帮助过:23人阅读

本教程介绍了如何使用具备 Web 功能的 NetBeans IDE 构建一个可以创建、检索、更新和删除数据库行的 Web 应用程序。该应用程序提供一个主数据的下拉列表以及一个同步的详细信息表。该 应用程序的用户可以在详细信息表及其关联数据库中添加、更新和删除记录。

本教程介绍了如何使用具备Web功能的NetBeans IDE构建一个可以创建、检索、更新和删除数据库行的Web应用程序。该应用程序提供一个主数据的下拉列表以及一个同步的详细信息表。该 应用程序的用户可以在详细信息表及其关联数据库中添加、更新和删除记录。

本教程使用了其他基础教程中介绍的一些概念。如果您不具备 IDE 及其设计组件的基本知识,可以考虑首先阅读一些入门教程,比如Visual Web JSF应用程序开发入门使用Databound组件访问数据库

测试应用程序:第1部分

单击主工具栏上的Run Main Projec 按钮 以生成、部署和运行项目。当Web浏览器呈现此页面时,您会看到一些名字填充了下拉列表,并且表也由一些数据进行了填充。当您从列表中选择某个名字时,与该名字相关的旅程就会显示在表格中。

添加插入功能

在此部分,我们将通过在数据库中插入行集,实现将行程添加到表中的功能。首先,为TableText Field提供Message组件。这些组件可确保当用户输入错误信息时可以看见错误。然后,在页面中添加一个按钮,以便用户可以通过它将新行添加到数据缓冲区中。

1. 单击Design按钮以便在Visual Designer中查看Page1

2. PaletteBasic区域中,将Message组件分别拖放到Table的前三列每列的最顶层Text Field中。

3. 选择第一个Message组件。在Properties窗口中,滚动至for属性,并从下拉列表中选择textField1选项。只有当MessageText Field正确关联时,Message文本才会显示关联信息,如图11所示。

4. 将第二个Message组件的for属性设置为textField2

5. 将第三个Message组件的for属性设置为textField3

6. PaletteBasic区域,将一个Button组件拖到Page1中并将其放在靠近第二列顶端的Table组件的上面,如图12所示。

特别注意:IE7中有一个影响JSF 1.2 Button组件宽度的已知问题。解决方法是将Button组件放在布局组件(Grid PanelGroup Panel Layout Panel)的上面。重设布局组件的大小会自动重设Button组件的大小。

7. 将文本从Button更改为Add Trip

8. Properties窗口中,将按钮的id属性更改为add

9. Visual Designer中,双击按钮以打开Java Editor,插入点将位于该按钮的add_action事件处理程序方法中。

10.将下面以粗体显示的代码添加到该按钮的事件处理程序方法中:

代码示例 3:添加行程操作的代码

public String add_action() {
        try {
            RowKey rk = tripDataProvider.appendRow();
            tripDataProvider.setCursorRow(rk);
            tripDataProvider.setValue("TRIP.TRIPID", new Integer(0));
            tripDataProvider.setValue("TRIP.PERSONID", personDD.getSelected());
            tripDataProvider.setValue("TRIP.TRIPTYPEID", new Integer(1));
        } catch (Exception ex) {
            log("Error Description", ex);
            error(ex.getMessage());
        }
        return null;
    }

11.Java编辑器中单击鼠标右键,然后选择Fix Imports选项以解决未找到 RowKey的错误。

IDE会将下包添加到导入语句的Page1.java段:

import com.sun.data.provider.RowKey;

测试应用程序:第2部分

通过单击Run Main Project按钮 以生成、部署和运行项目。当Web浏览器呈现此页面时,将显示Add Trip按钮,如下图所示。每次单击该按钮时,都会在表的底部附加一个新的空行。可以编辑行中的信息,但由于尚未提供行集的保存机制,因此,从下拉列表中选择其他名字时,所做的更改将会丢失。

修改页面以保存行集

在此部分,将添加第二个行集到项目中。该行集用于计算已使用的最大行程ID

1. 单击编辑器窗口中的Design以返回Visual Designer中的Page1

2. 打开Services窗口,选择Databases > Travel > Tables > TRIP表,将其拖动到Navigator窗口中的SessionBean1节点上。

3. 该操作将为SessionBean1创建两个新子节点:tripDataProvidertripRowSet1

4. Add New Data Provider对话框中,选择Create SessionBean1/tripRowSet1单选按钮,将数据提供程序名称更改为maxTripRowSet,然后单击OK按钮。

注意: 行集在对话框中出现了两次。这是一个已知问题,请予以忽略。这不会影响本教程中的应用程序。
此操作将在SessionBean1中创建maxTripDataProvidermaxTripRowSet

5. Navigator窗口中,双击SessionBean1 > maxTripRowSet以打开Query Editor。在Source Code窗格(从顶部开始第三个)中单击鼠标左键。删除此处现有的SQL查询,然后输入以下查询:

        SELECT MAX(TRAVEL.TRIP.TRIPID)+1 AS MAXTRIPID FROM TRAVEL.TRIP

您将会使用Save按钮(下一步您将会添加)的操作处理器中的MAXTRIPID值。

6. 关闭Query Editor

注意: Query Editor的图形化编辑器不支持此查询。如果您看见一个警告对话框提示语法错误,您可以单击Continue按钮忽略它。

将用户更改保存到数据库

1. 在靠近第一列顶部的Table组件上放置一个Button组件。为了准确定位

2. 将按钮文本从Button更改为Save Changes

3. Properties窗口中,将id属性更改为save

4. 右键单击Save Changes按钮,并从弹出菜单中选择Configure Virtual Forms选项。

5. Configure Virtual Forms对话框中,请确保save显示在左上角的列表中,这样您在此窗口中的更改可以应用到Save Changes按钮中。然后,选择save虚拟表单,将Submit值更改为Yes,并单击OK按钮。

6. Visual Designer中,双击Save Changes按钮以打开Java Editor。在Java Editor中,插入点将位于该按钮的save_action事件处理程序方法中。

7. 将下面以粗体显示的代码添加到该按钮的事件处理程序方法中:

代码示例 4:保存操作代码

    public String save_action() {
        try {
            // Get the next key, using result of query on MaxTrip data provider
            CachedRowSetDataProvider maxTrip = getSessionBean1().getMaxTripDataProvider();
            maxTrip.refresh();
            maxTrip.cursorFirst();
            int newTripId = ((Integer) maxTrip.getValue("MAXTRIPID"));
            // Navigate through rows with data provider
            if (tripDataProvider.getRowCount() > 0) {
                tripDataProvider.cursorFirst();
                do {
                    if (tripDataProvider.getValue("TRIP.TRIPID").equals
                                          (new Integer(0))) {
                        tripDataProvider.setValue("TRIP.TRIPID",
                                            new Integer(newTripId));
newTripId++;
                    }
} while (tripDataProvider.cursorNext());
}
tripDataProvider.commitChanges();
} catch (Exception ex) {
log("Error Description", ex);
error("Error :"+ex.getMessage());
}
return null;
}

测试应用程序:第3部分

通过单击Run Main Project按钮以生成、部署和运行项目。应用程序将可以实现以下功能:

l 可以添加行程并进行保存。然后,该行程将显示在表中并持续存在。如果选择其他人员,然后返回到此人员,则会看到所添加的行程。

l 可以编辑现有的行程信息,并保存所做的更改。

l 如果在Date字段中输入除日期之外的内容,应用程序将提供一条错误消息。

l 在保存之前您可以多次单击Add Trip按钮,这是一次添加多行的简便方法。如果在保存更改时任何行仍然为空,则会将其保存为空行。

l 如果在单击Save Changes之前您切换到其他人员,则会丢失所有更新。

l 如果修改了某些值,然后单击某个列标题以按该列进行排序,则Table组件会记住这些暂挂的更改,随后可以保存这些更改。

添加删除功能

在此部分,我们将在表中添加删除功能。利用此功能,用户能够通过从数据库中删除某行来删除行程。在本教程中,Delete按钮的操作是即时的,并且从数据库中删除行时并不需要使用Save Changes按钮。实际上,由于Delete按钮的事件处理器使用commitChanges方法,它也会像Save Changes按钮一样保存所有待定的更改。

向每行添加一个Delete按钮

1. 单击编辑器窗口中的Design以返回Visual Designer中的Page1,然后右键单击Trips Summary表,并从弹出菜单中选择Table Layout选项。这将打开Table Layout对话框。

2. 如有必要,单击Columns选项卡,然后单击New按钮,将一个新列添加到表中。

3. Selected列表中选择新列的名称后,在Column Details区域中进行以下更改:

a. HeaderFooter Text删除 HeaderFooter文本字段中的任何默认文本,使其保持空白。

b. Component type: Button

c. Value Expression: Delete

d. Width: 删除任何缺省值,使其保持空白。

e. Horizontal Align: Center

f. Vertical Align Middle

g. 单击OK按钮。

4. 选择表中最上面的Delete按钮,然后在Properties窗口中,将id属性设置为delete

添加事件代码

1. 双击Delete列中的第一个按钮,以在delete_action事件处理器方法中打开Java Editor

2. 将下面以粗体显示的代码添加到该按钮的事件处理程序方法中:

代码示例 5:删除操作代码

    public String delete_action() {
        form1.discardSubmittedValues("save");
        try {
            RowKey rk = tableRowGroup1.getRowKey();
            if (rk != null) {
                tripDataProvider.removeRow(rk);
                tripDataProvider.commitChanges();
                tripDataProvider.refresh();}
        } catch (Exception ex) {
            log("ErrorDescription", ex);
            error(ex.getMessage());
        }
        return null;
    }

测试应用程序:第4部分

通过单击Run Main Project按钮以生成、部署和运行项目。下图显示了该运行应用程序。

部署后,您应该可以从表中删除行,进而将其从数据库中删除。删除操作还会将所有待定更改提交到数据库。

添加恢复功能

现在,将恢复功能添加到页面中。使用此功能,用户将可以放弃其编辑并恢复为以前保存的数据。注意:恢复功能不能恢复已保存或删除的行;Save ChangesDelete 按钮会将更改提交到数据库。

添加Revert Changes按钮

1. 单击编辑器窗口中的Design以返回到Visual Designer中的Page1,然后从Palette中拖一个Button组件到Page1。将该新Button放在Add Trip按钮的右侧。

2. 将按钮文本更改为Revert Changes

3. Properties窗口中,将该Button组件的id属性更改为revert

4. 双击Revert Changes按钮以在revert_action方法中打开Java Editor

5. 将下面代码样例中以粗体显示的代码添加到revert_action方法中。

代码示例 6:恢复操作代码

 public String revert_action() {
        form1.discardSubmittedValues("save");
        try {
            tripDataProvider.refresh();
        } catch (Exception ex) {
            log("Error Description", ex);
            error(ex.getMessage());
        }
         return null;
    }

配置虚拟表单

如果应用程序使用目前的配置,则会出现一些不理想的行为。例如,如果用户在现有行的第一列中输入无效日期,然后单击Add按钮,操作将会失败,由于日期转换错误而拒绝提交表单。用户单击Add按钮时的理想行为是:放弃处理表中的输入字段,以便在忽略现有行的暂挂编辑内容的情况下添加新行。

同样地,当用户单击Revert按钮时(其目的是放弃所有编辑内容),也应该忽略以上情况的编辑内容。但是,当用户单击Delete按钮时,您仍然希望进行验证,因为此按钮不仅删除某个行,而 且还会提交所有暂挂的更改,这要求先处理输入字段。

要为确保用户在单击AddRevert按钮时放弃处理(包括验证检查)页面上的输入字段,您可以让这些按钮提交虚拟表单。在这种情况下,您可以使两个按钮提交同一个虚拟表单,因 为它们需要一个没有参与者的虚拟表单。

1. Visual Designer中,按Ctrl键的同时单击以选择AddRevertDelete按钮,单击鼠标右键,然后从弹出菜单中选择Configure Virtual Forms选项。

Configure Virtual Forms窗口中,addrevertdelete应出现在左上角,表明这些按钮处于选定状态。

2. Configure Virtual Forms窗口中,单击New按钮,将该新虚拟表单命名为add/revert/delete,然后将Submit设置为Yes。单击OK按钮。

测试应用程序:第5部分

通过单击Run Main Project按钮 以生成、部署和运行项目。部署后,程序可执行以下功能:

l 从下拉列表中选择一个名字,并显示此人的行程摘要。

l 编辑现有的行程信息,并将更改保存到数据库中。

l 编辑具有不正确的日期格式的现有行程信息,然后单击Add Trip按钮添加新行,或者单击Revert Changes按钮放弃编辑。

l 在表中添加行,填写行程字段,并将更改保存到数据库中。

l 从表中(同时从数据库中)删除行。

l 放弃编辑内容,并恢复为数据库中最近保存的数据。

结束语

在本教程中,您将Table组件、Text Field组件以及Drop Down List组件和数据库中的信息进行了关联。此外,还为组件设置了属性,添加了prerender和事件代码,从而可以插入、更新和删除数据库中的数据,并恢复在表单上输入的更改。您还使用了虚拟表单,这使得应用程序使用一个页面即可,并且在添加行或恢复更改时提交的数据可以绕过有效性检查。

人气教程排行