Thursday, July 14, 2011

Displaying a One To Many Master Detail Relationship In a Row.


Here is the scenario based on the HR Schema of Oracle XE.

UPDATE: Application is updated for

How could we represent a Department with all the employees in an horizontal way. In a row that means.

This is a typical master detail representation and can be easily done with tables. With ADF can be done quite fast. But, what if we want to have rows of Departments and the Employees of each Department in a single row?

Why bother doing it?? Well, why not?

Download the Sample Application.

Download Sample for

Here is a sample implementation to an answer.
Basically what we want is to have a table and, in each row, we want to have cells of the Department and a couple of cells for each employee of the corresponding Department.
This solution (I am sure there will be others) takes advantage of the tree binding of the page definition.


Entities: Departments, Employees
Entity Associations: Departments and Employees
Views: Departments, Employees
View Links: Departments and Employees from the above mentioned Entity Association.

a jspx with a page definition

and some manual coding in the jspx.

For the Business Components creation, we use the wizard and we produce the bc we want. Actually, there are only two tables, Departments and Employees.

Then, we create a jspx and a page Definition.
In the page Definition, we add a tree component:

after pressing ok, we select the root data source. In our case is the DepartmentsView.

After pressing ok, we shuttle the DepartmentName attribute on the right:

Then, again, add another rule, the one of the employees and shuttle the FirstName and the LastName (the same as we did with Departments):

Now, basically, we are done with our bindings. That's it. All we have to do is "paint" our page.
We are going to manually construct our table. We are going to use the simple html table, for this example, and the af:iterator component.
What we are going to do is to iterate the Depts and for each dept we are going to iterate the employees.

At that time we are going to create our table.

So, for every we will place 2 for the information for every department
Inside the same we will start a new iterator.
The employees iterator.
In order to fetch the correct employees all we have to do is to get the children of
the var of the master iterator
Since we want to be represented as a "table"

Eventually our table will look something like the following:

As you can see from the picture above the number of the employees is not standard. This is quite logical since every Department might have different number of employees. For the sake of the example, we limited the number of rows of the employees iterator to 2.  So what we see is maximum 2 employees  of every Department. Of course one can easily change this number to a more dynamic one.
Below are the screens of the code of the jspx:

For the Labels:

For the actual Data:

As you can see, it is fairly easy to present horizontally a one to many relationship..

Download the sample application.

Download Sample for


No comments:

Post a Comment


Related Posts Plugin for WordPress, Blogger...