< Java Web Application & Derby Database | Java & Friends | Java Web App: Insert, Delete Update - Derby 2 >

 


 

 

Java Web Application:

Performing Inserts, Updates, and Deletes (Derby database) Part 1

 

 

 

Contents:

  1. Machine specification used in this tutorial

  2. Creating the Project

  3. Designing the Page

  4. Configuring the Drop Down List

  5. Configuring the Table

  6. Changing the Column Components

  7. Configuring the Virtual Form for the Table

  8. Adding Event and Initialization Code

  9. Testing Your Application – Part 1

  10. Adding an Insert Feature

  11. Testing Your Application – Part 2

  12. Modifying the Page to Save RowSet

  13. Saving User Changes into the Database

  14. Testing Your Application – Part 3

  15. Adding a Delete Feature

  16. Adding a Delete Button to Each Row

  17. Adding Event Code

  18. Testing Your Application – Part 4

  19. Adding a Revert Feature

  20. Adding a Revert Changes Button

  21. Configuring the Virtual Form

  22. Testing Your Application - Part 5

  23. Summary

This tutorial shows you how to use the NetBeans IDE and JSF 1.2 (Woodstock) components to build a web application that can create, retrieve, update, and delete database rows. The application provides a drop-down list of master data along with a synchronized detail table. Users of the application can add to, update, and delete the records in the detail table and from its associated database. This tutorial uses concepts introduced in other, more basic tutorials that also can be found in the main page.

In order to take advantage of the NetBeans IDE's Java EE 5 capabilities, use an application server that is fully compliant with the Java EE 5 specification such as the Sun Java Application Server 9/GlassFish.

This tutorial has been tailored for use with the GlassFish v2 Application Server. If you are using a different server, consult the Release Notes and FAQs for known problems and workarounds. For detailed information about the supported servers and Java EE platform, see the Release Notes.

The original tutorial can be found at netbeans.org. All credits must go to the original authors. In this tutorial we try to refine all the steps to more details using screen shots.

 

Machine specification used in this tutorial are:

Creating the Project

 

In this tutorial, you create a single-page web application. You begin by laying out the page, which includes a person and corresponding trips, as shown in the following figure.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

Designing the Page

 

1.      Create a new Web application named InsertUpdateDelete that uses the Visual Web JavaServer Faces framework. The application's Page1.jsp file opens in the Visual Designer.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

2.      From the Basic section of the Palette, drag a Drop Down List component to the upper left corner of the page. In the Properties window, change its id property to personDD.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

3.      Drag a Message Group component from the Basic Palette and place it to the right of the Drop Down List.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

4.      The Message Group component displays validation and conversion errors, as well as messages written to the Java Server Faces context by the info and error methods. These messages can prove helpful if you need to debug your project.

5.      Place a Table component below the other two components.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

Configuring the Drop Down List

 

1.      Open the Services window, expand the Databases node, and connect to the Travel database. If the jdbc node for the TRAVEL database's badge is broken and you cannot expand the node, the IDE is not connected to the database. To connect to the TRAVEL database, right-click the jdbc node for TRAVEL and choose Connect from the pop-up menu. When the Connect dialog box appears, enter travel for the Password, check Remember password, and click OK. If you do not see a jdbc node for the TRAVEL database, see the NetBeans Database Connectivity FAQ for information about making the database available to the IDE. Note: If you are using Apache Tomcat, copy the derbyClient.jar file to the <tomcat_install>/common/lib directory before you try to connect to the database. We are using glassfish here.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

2.      Expand the jdbc node for the TRAVEL database, then expand the Tables node. Note: The jdbc node for the TRAVEL database will be called the Travel node in the rest of this tutorial.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

3.      Drag the PERSON node onto the Drop Down List in the Visual Designer. The Navigator window shows a personDataProvider node in the Page1 section and a personRowSet node in the SessionBean1 section.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

4.      Right-click the Drop Down List and choose Auto-Submit on Change from the pop-up menu. This setting causes the page to be sent to the server whenever a new value is chosen from the list.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

 

5.      Right-click the Drop Down List and choose Configure Virtual Forms from the pop-up menu. In the resulting dialog box, note that personDD is shown in the upper left corner of the window to show that the Drop Down List has been selected.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

6.      Click New and type person in the Name column. Double-click the field under the Participate column and set it to Yes, and then do the same for the Submit column, as shown in the following figure.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

By using a virtual form, the application avoids unnecessary validations for data in the Table.

 

7.      Click OK.

8.      Click the Show Virtual Forms button, Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots in the Visual Designer toolbar, as shown in the following Figure. By viewing virtual forms, you can see the relationship between components in the Visual Designer and any virtual forms that you have configured.

 

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

Configuring the Table

 

1.      Drag the Travel > Tables > TRIP node from the Services window and drop it on the Table component in the Visual Designer. If prompted to select a target component to receive the drop, select table1 and click OK.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

2.      Right-click the Table and choose Table Layout from the pop-up menu. The Table Layout dialog box shows the fields that are available from the tripDataProvider that you just created and lets you control which fields to display in the table.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

3.      Use the < button to remove TRIP.TRIPID, TRIP.PERSONID, and TRIP.LASTUPDATED from the Selected list on the right, as shown in the following figure.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

4.      Click the Options tab, change the Title to Trips Summary, and click OK.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

5.      Your Table component in the Visual Designer should now look as it does the following figure. Note that if your columns are not in the order shown, you can re-arrange them by reopening the Table Layout dialog box, clicking the Columns tab, and using the Up and Down buttons.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

6.      In the Navigator window, right-click tripRowSet under SessionBean1 and choose Edit SQL Statement from the pop-up menu. The SQL Query Editor opens.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

7.      In the grid area near the center of the window, right-click in the PERSONID row and choose Add Query Criteria, as shown in the following figure.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

8.      In the Add Query Criteria dialog box, set the Comparison drop-down list to =Equals and select the Parameter radio button, and then click OK.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

The characters "=?" appear in PERSONID's Criteria field, and the criteria "WHERE TRAVEL.TRIP.PERSONID=?" appears at the end of the SQL statement in the SQL Pane at the bottom of the editor.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

9.      Close the SQL Editor for tripRowSet.

 

Changing the Column Components

 

You now change the column contents to be editable fields in preparation for adding the ability to insert new trips into the database. When you do so, you take advantage of the compound nature of the Table component by nesting other components inside it.

 

1.      Right-click the Table component and choose Table Layout. The Table Layout dialog box opens.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

2.      In the Columns tab, select TRIP.DEPDATE from the Selected list on the right. In the Column Details area at the bottom of the dialog box, change the Component Type from Static Text to Text Field, as shown in the following figure, and click Apply.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

3.      Perform the same action for TRIP.DEPCITY and TRIP.DESTCITY.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

------------------------------------------------------------------------------------------------------------------

 

------------------------------------------------------------------------------------------------------------------

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

4.      Select TRIP.TRIPTYPEID in the Selected list and change the Component Type from Static Text to Drop Down List.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

5.      Click OK.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

6.      Drag the Travel > Tables > TRIPTYPE node onto the Drop Down List in the Table component. If the Choose Target dialog opens, select dropDown1 and click OK.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

This action creates the triptypeDataProvider that can be seen through the Navigator.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

Configuring the Virtual Form for the Table

 

Next you create a virtual form for the input components in the table. The virtual form ensures that when a change to the personDD drop-down list submits the page, the input components aren't put through validation and conversion. The correct information is displayed in the table whenever the user chooses a new person from the drop-down list.

 

1.      In the Visual Designer, use Ctrl-Click in the table to select the three Text Field components in the three columns containing text fields and the Drop Down List component in the TRIPTYPEID column.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

2.      Right-click one of the selected components and choose Configure Virtual Forms from the pop-up menu. You still need to hold-down the Ctrl key while right-clicking those components.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

3.      In the Configure Virtual Forms dialog box, make sure the three Text Fields and the Drop Down List are listed in the upper left corner of the window. If they are not all listed as shown in the following figure, close the dialog box, reselect them, and try again. When they are correctly listed, click New.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

4.      Change the name of the new virtual form to save and the Participate setting to Yes, as shown in the following figure, and then click OK.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

Adding Event and Initialization Code

 

You now associate the personDD Drop Down List with the Table component to enable the following behavior: When the user selects a person from the list, that person's trips will appear in the table.

 

1.      Double-click the personDD Drop Down List to create a value change event method and to open the Java Editor on that method.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

2.      In personDD_processValueChange method, add the bold text in Code Sample 1, and then press Alt-Shift-F to reformat your code.

 

Code Sample 1: Drop Down List Event Handler

 

   public void personDD_processValueChange(ValueChangeEvent event) {

       Object selectedPersonId = personDD.getSelected();

       try {

           personDataProvider.setCursorRow(personDataProvider.findFirst("PERSON.PERSONID",

                      selectedPersonId));

           getSessionBean1().getTripRowSet().setObject(1, selectedPersonId);

           tripDataProvider.refresh();

           form1.discardSubmittedValues("save");

       } catch (Exception e) {

           error("Cannot switch to person " + selectedPersonId);

           log("Cannot switch to person " + selectedPersonId, e);

       }

   }

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

At the end of the try clause, the statement form1.discardSubmittedValues("save") ensures that whenever the user selects a new person from the drop-down list, current trip information shown in the table will be replaced by new information related to the chosen person. Recall that all user interface elements in the table that display the trip information participate in the virtual form named save.

Note also that the event handler does not throw exceptions. Instead, it logs them in the server.log file. The event handler also calls an error method that, in the event of an error, displays a message in the Message Group component.

 

3.      Scroll in the Java source to the prerender method, or, if you prefer, type Ctrl-F and search for prerender. Add the following code in bold to the method.

 

Code Sample 2: Prerender Method

 

public void prerender() {

       if ( personDD.getSelected() == null ) {

           Object firstPersonId = null;

           try {

               personDataProvider.cursorFirst();

               firstPersonId = personDataProvider.getValue("PERSON.PERSONID");

               personDD.setSelected(firstPersonId);

               getSessionBean1().getTripRowSet().setObject(1, firstPersonId);

               tripDataProvider.refresh();

           } catch (Exception e) {

               error("Cannot switch to person " + firstPersonId);

               log("Cannot switch to person " + firstPersonId, e);

           }

       }

   }

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

4.      Right-click in the Java Editor and choose Format to make the code align correctly.

 

Step-by-step on Java web application development: insert, update and delete data on Derby database sceenshots

 

Continue on part 2.

 

 

 

 

 

 

 

 

Java Web: Insert, Update and Delete on Derby: Part 1 | Part 2


 

< Java Web Application & Derby Database | Java & Friends | Java Web App: Insert, Delete Update - Derby 2 >