Flex, BlazeDS, and Hibernate JPA on Tomcat and MySQL – Part 2: Extending the demo to use linked database relations

Additional Requirements

Flex 3 SDK

• Download

Eclipse

• Downlooad (choose "Eclipse IDE for Java EE Developers")

Hibernate

• Learn more

You'll need:

• Hibernate Core 3.3.2
• Hibernate Annotations 3.4.0 GA
• Hibernate EntityManager 3.4.0 GA
• Hibernate Validator 3.1.0

Apache Tomcat

• Learn more

MySQL

• Learn more

MySQL Connector/J

• Learn more

Java Runtime Environment (JRE)

• Learn more
• Adobe Flex Builder ships with JRE 1.5

This tutorial is part 2 of the series “Flex, BlazeDS, and Hibernate JPA on Tomcat and MySQL”. In this article, I extend the application developed in Part 1 by adding a second database table.

How is this reflected in the application? Part 1 contained only an entity to create Consultant objects. In part 2, I introduce Project objects as well as the ability to assign Projects to Consultants using drag-and-drop (see Figure 1).

The sample application for this article makes use of the following software and technology:

• Eclipse 3.4.2 "Ganymede"
• Adobe Flex Builder 3.0.2
• Adobe Flex SDK 3.3
• Adobe BlazeDS 3.2.0.3978
• MySQL 5.1.36
• Hibernate 3.3.2
• Apache Tomcat 6.0.18
• Sun Java JRE 1.6.0_13

The application uses a Flex front end to perform the following tasks:

• Create new data records in a database
• Read data from a database
• Update existing data in a database
• Delete data from a database
• Assign a data record in one table to another data record in a different table by using a mapping table

The sample application uses Adobe Flex as the presentation layer. The sample files provide all the code and configuration settings that are required to deploy and launch the application.

Part 1 of this article describes how to install the software. While the same software is used for this article, in some cases I’ve updated to newer versions. For example, I use MySQL 5.1.36 now in place of MySQL 5.0.67.

Starting and stopping MySQL

Before you start developing the application, you need to start MySQL and create a database. While you can do this in Eclipse<; in this case it’s simpler to use the command prompt. To start MySQL, open a command prompt and change to the MySQL directory containing the database files; for example: C:\ADC\mysql\mysql—5.1.36—win32\bin.

Execute this command to start the database server:

mysqld ——console

Later, if you need to shutdown MySQL, you can do so by executing this command:

mysqladmin —u root shutdown

Creating the database

While in the MySQL folder, execute the following command from the command prompt:

mysqladmin —u root create consultant_db

The newly created database is named consultant_db. You can verify that the database has been successfully created by executing this command:

mysqlshow —u root

What about the database tables?

Hibernate will generate the database tables from the Java beans when the application is run for the first time. This is a great thing, because you do not have to worry about creating SQL statements to set up tables and columns.

Preparing the development environment

See Preparing the development environment in Part 1 of this article for a detailed description of how to set up your development environment. It is important to set up the Tomcat server, so the application can be run and tested on the server.

Now you are ready to start developing the actual application. The complete source code and XML files are included with this article’s sample files. You can use the code by copying and pasting the file contents or by simply copying the files to the correct location in your file system.

Server side configuration

The following files are used on the server:

log4j.xml

The sample application uses the Apache log4j logging utility to log database access. You need an XML configuration file in the Java Source folder named log4j.xml to configure log4j. Use the sample log4j.xml file to create your own copy in the Java source folder.

persistence.xml

When using the Java Persistence API (JPA) implementation of Hibernate you need to configure the entity beans. This is done with an XML configuration file called persistence.xml, which is a standard configuration file in JPA. It has to be included in the META—INF directory inside the classpath of the project or in a JAR file that contains the entity beans. The persistence.xml file must define a persistence—unit with a unique name in the current scoped classloader. Here it is for the sample application:

<persistence—unit name="consultant_db">

Create a new folder in the Java Source folder and name it META—INF. Copy the sample persistence.xml file to the META—INF folder.

remoting-config.xml

On the sever side you need to extend a BlazeDS configuration file to enable the Java service to be accessed later from the Flex client. Replace the remoting—config.xml file in the project folder WebContent/WEB—INF/flex with the remoting—config.xml included with the sample files. This file adds two new destination blocks that are identified by their IDs consultantService and projectService. The services are linked to the Java service classes ConsultantService and ProjectService.

Server layer

Create a new Java package beneath the Java source folder and name it com.adobe.demo.domain. You can then start creating the three Java classes.

BaseDomain.java

Create a new Java class BaseDomain in the Java package com.adobe.demo.domain. Copy the code from the sample BaseDomain.java file. This class is extended by the Consultant and the Project classes, because it provides the attribute id and the attribute created as a timestamp.

Consultant.java

Create a new Java class Consultant in the Java package com.adobe.demo.domain. Copy the code from the sample Consultant.java file. The Consultant class is the entity bean that defines the structure of the Consultant object. It also contains the annotations (a special form of syntactic metadata) that describe the database relation (here, the table including its columns) and some SQL queries. For example, the annotation @Table holds the name of the database table that will be created when the application runs the first time:

@Table(name = "consultants")

The new attribute projects stores all projects assigned to the Consultant. The annotations @ManyToMany and @JoinTable define the database relationship and result in a new mapping table named consultants_projects, which is used to store the relations.

Project.java

Create a new Java class Project in the Java package com.adobe.demo.domain. Copy the code from the sample Project.java file. The Project class is the new entity bean that defines the structure for a Project object. This class also contains annotations to map the Consultant’s list attribute with the database mapping table consultants_projects. If a project is deleted, all corresponding projects that are assigned to consultants will be removed from the mappings table as well. This ensures consistent data handling.

ConsultantService.java

Create a new Java class ConsultantService in the Java package com.adobe.demo. Copy the code from the sample ConsultantService.java file.

The service class contains several methods, some of which are called by the Flex application:

• getConsultants: Retrieves all rows from the database table consultants
• getConsultantById: Retrieves a consultant by a given ID from the database
• addUpdateConsultant: Adds or updates a consultant record to the database
• deleteConsultant: Deletes a consultant record from the database
• deleteAllConsultants: Deletes all consultant database records
• addProjectToConsultant: Assigns a project to a consultant
• addProjectsToConsultant: Assigns multiple projects to a consultant

ProjectService.java

Create a new Java class ProjectService in the Java package com.adobe.demo. Copy the code from the sample ProjectService.java file.

The service class contains the following methods, which are called by the Flex application:

• getProjects: Retrieves all rows from the database table projects
• getProjectById: Retrieves a project by a given ID from the database
• addUpdateProject: Adds or updates a project record to the database
• deleteProject: Deletes a project record from the database
• deleteAllProjects: Deletes all project database records

Client layer

To create the client layer, begin by creating a hierarchical folder structure in the flex—src folder similar to the Java package. The following list describes each of the main files used in the Flex view.

ADCDemo.mxml

This is the main Flex application. It contains the view components to list the consultants and the project database records.

BaseDomain.as

This class is extended by the Consultant and the Project classes. It provides the attribute id and the attribute created as a timestamp.

Consultant.as

This class defines the client object that holds the consultant information. Note that the class refers to the corresponding Java class Consultant.java. This is accomplished with the code [RemoteClass(alias="com.adobe.demo.domain.Consultant")]

This class defines the client object that holds the project information. Note that the class refers to the corresponding Java class Project.java. This is accomplished with the code [RemoteClass(alias="com.adobe.demo.domain.Project")]

ListConsultants.mxml

This is the view component to list all consultants and to perform the actions that will change the data in the database, like add, update, and delete a consultant. When a consultant is selected in the top list, the assigned projects are then shown in the list below.

ConsultantForm.mxml

The consultant form is the Flex view component to enter or update a consultant object and to assign or remove project items from the consultant. Drag—and—drop is supported by the list components in this view.

ListProjects.mxml

This view component lists all available projects stored in the database and enables the user to create, update, and delete projects, as well as reload data.

ProjectForm.mxml

This is a simple form to enter or change a project name and to save the project object to the database.

Open a web browser and enter the following URL to access the sample application:

http://localhost:8080/ADCDemo/ADCDemo.html

It takes a few seconds for the database table to be generated. Once completed, the initial screen is displayed (see Figure 2).

To create a new consultant record, click Create Consultant and enter the data in the new window. Before assigning projects to the consultant you’ll need to select the Projects tab and create one or more projects. After you create some projects, you can assign those objects to a consultant (see Figure 3) and save the consultant object to the database.

The newly created record is displayed in the upper list and the assigned projects can be seen in the list at the bottom of the screen (see Figure 4).

Where to go from here

I’ve kept the sample application fairly simple and straightforward. When you are building a more complex application with multiple tables, it is better to create more generic Java code, for example by using data access objects (DAOs).

Look for more samples in Tour de Flex that use the Hibernate assembler and data services samples.

The following resources provide more details on the technologies used in this article:

• Adobe Flex 3 Online Help
• Adobe BlazeDS
• Adobe BlazeDS Developer Guide
• Hibernate Documentation Overview
• Java Persistence with Hibernate
• MySQL 5.1 Reference Manual