Create Master Detail Form in Oracle ADF

1. Create a New Application

New > Applications > Fusion Web Application (ADF)
 

 
Application Name – MasterDetailApp
Directory -- (Jdev install dir)/jdeveloper/(project name)
Application Package Prefix – Demo.adf.masterdetail
 

 

 

 

 

 
2. We need two tables one table will be act as Master table and second table will be act as Child or detail table. Lets Create two tables
CREATE TABLE master_table_demo
(    -- --------------------
     -- Data Columns
     -- -------------------- 
     Column1                    VARCHAR2(100),
     Column2                    VARCHAR2(100),
     -- --------------------
     -- Who Columns
     -- --------------------
     last_update_date      DATE            NOT NULL,
     last_updated_by       NUMBER     NOT NULL,
     creation_date             DATE            NOT NULL,
     created_by                  NUMBER     NOT NULL,
     last_update_login     NUMBER
);
CREATE TABLE detail_table_demo
(     -- --------------------
      -- Data Columns
      -- -------------------- 
      Column1                  VARCHAR2(100),
      Column2                  VARCHAR2(100),
      -- --------------------
      -- Who Columns
      -- --------------------
      last_update_date    DATE           NOT NULL,
      last_updated_by     NUMBER    NOT NULL,
      creation_date           DATE           NOT NULL,
      created_by                NUMBER    NOT NULL,
      last_update_login   NUMBER
);
 
Note – Consider Master Table is Linked to Detail Table with Column1
 
3. Lets put some data in the tables
-- Insert Data into Master Table
INSERT INTO master_table_demo VALUES ( 'VAL1', 'VAL2', SYSDATE, 0, SYSDATE, 0, 0);
INSERT INTO master_table_demo VALUES ( 'VAL3', 'VAL4', SYSDATE, 0, SYSDATE, 0, 0);
 
-- Insert Data into Detail Table
INSERT INTO detail_table_demo VALUES ( 'VAL1', 'VAL6', SYSDATE, 0, SYSDATE, 0, 0);
INSERT INTO detail_table_demo VALUES ( 'VAL3', 'VAL8', SYSDATE, 0, SYSDATE, 0, 0);
 
4. Create Master EO and VO (Entity Object and View Object)
Right Click on Model > New > ADF Business Components > Entity Object
Package -- Demo.adf.masterdetail.model.entities
Name – MasterEO
Schema Object -- MASTER_TABLE_DEMO
 
Note – By default ROWID will be the primary key if we will not make any column to be primary key in Attribute Setting Page
 
Check the Accessors, Create Method, and Remove Method
Check Generate Default View Object CheckBox
Package – Demo.adf.masterdetail.model.queries
Name – MasterVO
 
5. Create Detail EO and VO (Entity Object and View Object)
Right Click on Model > New > ADF Business Components > Entity Object
Package -- Demo.adf.masterdetail.model.entities
Name – DetailEO
Schema Object -- DETAIL_TABLE_DEMO
 
Note – By default ROWID will be the primary key if we will not make any column to be primary key in Attribute Setting Page
 
Check the Accessors, Create Method, and Remove Method
Check Generate Default View Object CheckBox
Package – Demo.adf.masterdetail.model.queries
Name – DetailVO
 
6. Create ViewLink between MasterVO and DetailVO
Right Click on Model > New > ADF Business Components > View Link
Package -- Demo.adf.masterdetail.model.queries
Name – MasterDetailVL
Display Name – Master Detail View Link
Extends – Null (Blank)
 

 
Expand MasterVO in the Source Section and select Column1 do the same for DetailVO in the destination and press Add button then NEXT
(Because Column1 is common column between both the tables as per our assumption to create view link)
 

 
Leave the default Accessors Names as shown in slide and press Finish
 

 
7. Create AM (Application Module)
Right Click on Model > New > ADF Business Components > Application Module
Package -- Demo.adf.masterdetail.model.services
Name – MasterDetailAM
Display Name -- Master Detail Application Module
 

 
Select MasterVO and DetailVO via MasterDetailVL and shuffle to right in Data Model
 

 

 
Check Generate Application Module Class: MasterDetailAMImpl
 

 

 
8. Create JSF Page
Right Click on ViewController > New > Web Tier > JSF > JSF Page
File Name – MasterDetail.jspx
Initial Page Layout and Content – select Blank Page
Expand Page Implementation and select Automatically Expose UI Components in a New Managed Bean
 
Refine Page Layout As below --
1. Drop PanelSplitter from the Components Palette
2. Drop PanelBox then drop Panel Accordion in the First facet of the Panel-splitter and set
Text – Master
3. Drop another Panel-splitter in second facet and set the Orientation property to Vertical from Property Inspector
4. Drop Panel Accordion in the first facets of the Last panel splitter set
Text – Detail
5. Drop Panel Accordion in the Second facet of the last panel-splitter set
Text – Edit Detail
Page and structure will look like as below slide –
 
 
 

 
 9. Create Data-bound Components in Page
Expand the Data Controls Drag MasterVO1 to Detail Panelbox and choose Form > ADF Read-only Form. Choose the fields as shown in the slide
 

 

 
Note – Select Checkbox “Include Navigation Controls”
 

 
Expand the Data Controls Drag DetailVO1 to Detail Panelbox and choose Table > ADF Read-only Table
 

 
Note -- Select CheckBox “Enable Sorting” and “Enable Filtering” and Under Row Selection select “Multiple Rows”
 

 
Expand the same DetailVO1 node from data control and drag to Edit Detail section and choose Form > ADF Form. Choose the fields as shown in the slide
 

Note – Select CheckBox Include Submit Button
 


 
Final page will look like this following slide –
 

 
Set Style Class Property to AFStrechWidth for af:panelAccordion – pa2 Panel as shown in slide. For Accordion to stretch the table at Runtime


10. Congratulation you have successfully finished. Test Your Work Your Master Detail Page is Ready