Continuing from my last post, I'll show the next steps in the creation of this simple (but not too simple) client purchase application. This time, our main focus is in creating a separate dialog which we will use for data entry. We'll need to do a few tricks so that input from the dialog is propagated to the main form and then the database.
But first we'll need to clear up a few loose ends. As I alluded to last time, I use AUTO_INCREMENT attributes for the ID columns of the CLIENTS, COUNTRIES, and ORDERS tables. This means that whenever a new row is added to those tables, that row's AUTO_INCREMENT field is given a unique value (the value of the last new record + 1). For me using AUTO_INCREMENT is a handy way to ensure having unique records.
When you generate the skeleton of the application in the New Java Desktop Application wizard, the IDE generates two entity classes (Clients.java and Orders.java) that represent database tables with the same names. However, these entity classes are missing code to deal with the AUTO_INCREMENT fields. Without that code, you will get errors when trying to enter new records. To fix that:
- Open the Clients.java class.
- Navigate to the line after the one containing
- Enter the line
- Press Ctrl-Shift-I to generate the necessary import statements for this annotation.
- Repeat the process for Orders.java.
Note: You can also use code completion here. It takes three selections to get the entire line, but the import statements are generated for free.
Once you have added these annotations, you can run the application and start adding data. Click the top New button to add a client. With a client selected, click the bottom New button to add an order for that client. Click Save to push your changes to the database. Click Refresh to back out any unsaved changes.
I like tables for browsing data, but I think they leave something to be desired for data entry. So for this application, we'll add dialogs for data entry.
To create and populate the JDialog, follow these steps:
- Right-click the package that contains your classes and choose New | Other. Select Swing GUI Forms | JDialog Form template and name it
- From the Palette window drag, drop, and arrange components for the customer's personal details.
You should have JLabels for each of the following fields: first name, last name, address, city, state, zip code, country, and phone number. You should have JTextFields for each of those fields, except for country, for which we will use a JComboBox.
- Edit the display text for JLabels.
- Add two buttons and name them Save and Cancel.
- (Optional) Rename all of the components you have added to more memorable names, such as
firstNameLabel. You can do this inline in the Inspector window.
The resulting layout should look something like what you see below.
Now we need to bind the various fields to the corresponding columns in the table. We can't bind directly to components from other forms in the Bind dialog box, so we'll have to create an intermediary property of type Clients to hold the record. When the user presses New, the property will be given the value of the currently selected record.
We can quickly generate the bean property with the IDE's bean support:
- At the top of the design area of the EditClient form, click the Source tab. Click somewhere within the class, such as above the variable declaration block.
- Press Alt-Insert (or right-click and choose Insert Code) and choose Add Property.
- In the Add Property dialog, name the property
currentRecord, give it the type
Clients, select Generate Getter and Setter, and select Generate Property Change Support.
- Click OK to generate the property.
We now need to customize the generated
setCurrentRecord method. Replace the body of the method with these three lines:
Clients oldRecord = this.currentRecord; this.currentRecord = currentRecord; propertyChangeSupport.firePropertyChange("currentRecord", oldRecord, currentRecord);
Now we need to add code to the New action to open the dialog and clear the currentRecord property when a user wants to add a new record:
JFrame mainFrame = ClientAndPurchaseApp.getApplication().getMainFrame(); EditClient ec = new EditClient(mainFrame, false); ec.setCurrentRecord(c); ec.setVisible(true);
For now, we won't code the Save and Cancel buttons on the dialog (we've had enough digressions!). I'll cover that in an upcoming post.
With those preliminaries out of the way, we can proceed with the binding of the text fields. We'll be binding the
textproperty of each text field to the corresponding property of the
Clients object represented by
To bind a dialog text field to the appropriate property of
- Right-click a text field and Choose Bind | text.
- In the Bind dialog box, select Form as the Binding Source (note that Form is at the very bottom of the drop-down list).
- In the Binding Expression drop-down list, expand the
currentRecordnode and select the property corresponding to the text field that you are binding.
- Click OK to close the Bind dialog box.
Do this procedure for each of the text fields in the dialog. For now, don't bind the JComboBox to anything. We'll need to do some other preparation to get that to work properly. I'll cover that in my next post.
Now you should be able to run the application, press the first New button, and enter data in the dialog. The Save and Cancel buttons on the dialog don't do anything yet, but we can save the records from the main frame. In the next post, we'll clear up some of these loose ends so that the application behaves more like applications that we are used to.