Adf Practise

ADF Hello World Tutorial
1. Create a New Application

New > Applications > Fusion Web Application (ADF)
Application Name HelloWorld

Directory -- (Jdev install dir)/jdeveloper/(project name)
Application Package Prefix Demo.adf.helloworld
2. Create JSF page

You will see Model and ViewController in HelloWorld application. Now Click on
ViewController and choose New
Web Tier > JSF > JSF Page
File Name HelloWorld.jspx

Check Create XML Document (*.jspx)
Select Blank Page in Initial Page Layout and Content Section
Select Automatically Expose UI Components in a New Managed Bean in
Page Implementation Section
3. Drag Decorative Box from Layout option available in Component

Palate
4. Drag item of type Input Text, Button on the center face of

decorativeBox from Common Components Section
5. Drag item of type Output Text on Top of decorativeBox from

Common Components Section
6. Select af:decorativeBox then go to Property Pallete and Double

Click Panel Group Layout in Layout Section
Select af:panelGroupLayout scroll and set following property

Halign -- center
7. Select top then go to Property Pallete and Double Click Panel

Group Layout in Layout Section
Select af:panelGroupLayout scroll under top and set following property

Halign center
8. Set Bind Action Property for commandButton

Double Click on commandButton that will open set Bind Action Property
window as shown below
Click Ok and then Write Following Code in cb1_action() which you have created just now
public String cb1_action()

{ RichInputText inputText = getIt1();
String name = "Hello "+(String)inputText.getValue()+ "!!";
ot1.setValue(name);
return null;
}
9. following properties for commandButton, input text and

outputText
Set Following Properties for inputText item

Label Name
Id it1
Set Following Properties for commandButton item

Id Go
Action cb1_action()
Text Go
Set Following Properties for outputText item

Id ot1
Value Null (Blank)
InlineStyle -- color:Red; font-family:Georgia, 'Times New Roman', times, Serif;
font-size:xx-large;
Color Red
Font -- Georgia, 'Times New Roman', times, Serif
Size -- xx-large
10. Congratulation you have successfully finished. Test Your Work Your
Hello World Page is Ready
2. Create Simple Search form in Oracle ADF

By PRajkumar on May 23, 2012

Application Name SearchForm
Application Package Prefix Demo.adf.searchform
2. Create Test Table and insert data some data in it (For Testing
Purpose)
CREATE TABLE xx_search_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
);
INSERT
0, 0);
INSERT
0, 0);
INSERT
0, 0);
INSERT
0, 0);
INTO xx_search_demo VALUES (val1, val2, SYSDATE, 0, SYSDATE,

3. Create EO
Right Click on Model > New > ADF Business Components > Entity Object
Package -- Demo.adf.searchform.model.entities
Name SearchEO
Schema Object XX_SEARCH_DEMO
Note By default ROWID will be the primary key if we will not make any column to
be primary key in Attribute Settings Page
Check the Accessors, Create Method, and Remove Method
Check Generate Default View Object CheckBox

Package Demo.adf.searchform.model.queries
Name SearchVO
Check Application Module CheckBox

Package Demo.adf.searchform.model.services
Name SearchAM
4. Define Bind Variables

Double Click on SearchVO in Model Project go to query page
Expand the Bind variable accordion and click on Green button
Bind Variable name and type as following make sure required check box is unchecked
Name Col1
Type -- String
5. Create Named View Criteria

Double Click on SearchVO in Model Project go to query page. Expand the View
Crriteria accordion and click on Green button
View Criteria is actually conditions on VOs which you usually define declaratively
1.
sign
2.
Expand the View Critieria Section in SearchVO page and click the Green plus
Give a proper name to your View Criteria
Criteria Name -- SearchVOCriteria
3.
Click on Add Item
Click the ( ) group press Add item and select values as sown in slide make
sure you have selected the bind variable Col1
Attribute Column1
Operator Equals
Operand Bind Variable
Parameter Col1
Un-check Ignore Case and Check Ignore Null Values
6. Create Search Form

Right Click on ViewController > New > Web Tier > JSF > JSF Page
File Name Search
Initial Page Layout and Content Quick Start Layout
Click on Browse and select One Column Stretched and check Apply Theme
Expand Page Implementation and Select Automatically Expose UI Components in a

New Managed Bean
Select SearchVO and Expand the Data Control panel and Drag and drop the Named
View Critieria SearchVOCriteria to the page
Choose Query > ADF Query Panel with Table as shown in the slide
The Page would look like this --
7. Refine Layout
Change the Header from SearchEO to Search Demo. To change select panel
Header and change Text property to Simple Search Demo
Note - You can change form properties like Column names and page width as per
your requirements

Simple Search Form is Ready
3.Creating LOV tab in oracle applications:

Create Master Detail... | Main | Oracle HRMS API ...
Create LOV in ADF Application

Application Name LovApp

Application Package Prefix Demo.adf.lov
2. We need to have table from where LOV values will come. Lets
Create table
CREATE TABLE lov_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,
);
3. Lets put some data in the tables

-- Insert Data into Master Table
INSERT INTO lov_table_demo VALUES ( 'VAL1', 'VAL2', SYSDATE, 0, SYSDATE, 0, 0);
INSERT INTO lov_table_demo VALUES ( 'VAL3', 'VAL4', SYSDATE, 0, SYSDATE, 0, 0);
4. Create EO for Our Page (Entity Object)
Note - EO is as per User Requirement, currently we are going to

create EO from above created table as demo purpose
Package -- Demo.adf.lov.model.entities
Name Column1EO
Schema Object -- LOV_TABLE_DEMO
be primary key in Attribute Setting Page

Package Demo.adf.lov.model.queries
Name Column1VO
Check Application Module Checkbox

Package Demo.adf.lov.model.services
Name Column1AM
5. Create View Object for Column1 LOV (View Object)

Right Click on Model > New > ADF Business Components > View Object
Package -- Demo.adf.lov.model.queries
Name Column1LovVO
Display Name -- Column1 Lov View Object
Select Column1EO Entity and Move to selected area uncheck the option
Updatable
Select Column1 attribute and move to Selected area
Click Finish
6. Create LOV
Double Click on Column1VO in Demo.adf.lov.queries section
Select Column1 attribute in attribute page and click + green button at the
bottom under List of Values Section
Click the green + button with List Data Source
Select Column1LovVO in Available object and change the Name at bottom to

Column1LOVAcessor and Press > button to Create Accessor for LOV and
click OK
Choose Column1 in List Attribute Return Values will populate automatically.

Your screen should similar to this
Go to UI Hints tab Leave the list type asChoice List (There are many type of LOVs
available)
Move Column1 Name from Available to Selected Area
Choose Labeled Item (First of List) at very bottom Include No

Selection Item:
Click OK
7. Linking LOV to JSF Page

Create a JSF Page
File Name LovDemo.jspx

Initial Page Layout and Content select Blank Page
Expand Page Implementation and select Automatically Expose UI
Components in a New Managed Bean
Expand the DataControl > Column1VO Select Column1 attribute and Drag
and Drop it to FormLayout
Menu will appear select Single Selection > ADF One Choice List as
Shown in the Slide
8. Your Final Page will look like this below slide
LovDemo Page is Ready
Conclusion
With Oracle ADF application development becoming fast and easy. See how
easy is to create LOVs in your ADF application as like in Oracle Forms
4. Create Simple Search... | Main | Create LOV in ADF...
Create Master Detail Form in Oracle ADF

Application Name MasterDetailApp

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
created_by
last_update_login
DATE
NUMBER
NUMBER
NOT NULL,
NOT NULL,
);
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,
);
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)

Package -- Demo.adf.masterdetail.model.entities
Name MasterEO
Schema Object -- MASTER_TABLE_DEMO

Package Demo.adf.masterdetail.model.queries
Name MasterVO
5. Create Detail EO and VO (Entity Object and View Object)

Package -- Demo.adf.masterdetail.model.entities
Name DetailEO
Schema Object -- DETAIL_TABLE_DEMO

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

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 Panelsplitter 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
Master Detail Page is Ready

Adf Practise

Enviado por

Dados do documento

Direitos autorais

Formatos disponíveis

Compartilhar este documento

Compartilhar ou incorporar documento

Opções de compartilhamento

Você considera este documento útil?

Este conteúdo é inapropriado?

Direitos autorais:

Formatos disponíveis

Adf Practise

Enviado por

Direitos autorais:

Formatos disponíveis

ADF Hello World Tutorial

1. Create a New Application

Application Name HelloWorld

2. Create JSF page

File Name HelloWorld.jspx

3. Drag Decorative Box from Layout option available in Component

4. Drag item of type Input Text, Button on the center face of

5. Drag item of type Output Text on Top of decorativeBox from

6. Select af:decorativeBox then go to Property Pallete and Double

Select af:panelGroupLayout scroll and set following property

7. Select top then go to Property Pallete and Double Click Panel

Select af:panelGroupLayout scroll under top and set following property

8. Set Bind Action Property for commandButton

public String cb1_action()

9. following properties for commandButton, input text and

Set Following Properties for inputText item

Set Following Properties for commandButton item

Set Following Properties for outputText item

Hello World Page is Ready

2. Create Simple Search form in Oracle ADF

1. Create a New Application

INTO xx_search_demo VALUES (val1, val2, SYSDATE, 0, SYSDATE,

Check Generate Default View Object CheckBox

Check Application Module CheckBox

4. Define Bind Variables

5. Create Named View Criteria

Click on Add Item

6. Create Search Form

Expand Page Implementation and Select Automatically Expose UI Components in a

The Page would look like this --

8. Congratulation you have successfully finished. Test Your Work Your

3.Creating LOV tab in oracle applications:

1. Create a New Application

Application Name LovApp

CREATE TABLE lov_table_demo

3. Lets put some data in the tables

4. Create EO for Our Page (Entity Object)

Note - EO is as per User Requirement, currently we are going to

Check the Accessors, Create Method, and Remove Method

Check Generate Default View Object CheckBox

Check Application Module Checkbox

5. Create View Object for Column1 LOV (View Object)

Select Column1 attribute and move to Selected area

Click the green + button with List Data Source

Select Column1LovVO in Available object and change the Name at bottom to

Choose Column1 in List Attribute Return Values will populate automatically.

Choose Labeled Item (First of List) at very bottom Include No

7. Linking LOV to JSF Page

File Name LovDemo.jspx

8. Your Final Page will look like this below slide

9. Congratulation you have successfully finished. Test Your Work Your

LovDemo Page is Ready

1. Create a New Application

Application Name MasterDetailApp

Note Consider Master Table is Linked to Detail Table with Column1

3. Lets put some data in the tables

-- Insert Data into Detail Table

INSERT INTO detail_table_demo VALUES ( 'VAL3', 'VAL8', SYSDATE, 0, SYSDATE, 0, 0);

4. Create Master EO and VO (Entity Object and View Object)

Check the Accessors, Create Method, and Remove Method

Check Generate Default View Object CheckBox

5. Create Detail EO and VO (Entity Object and View Object)

Check the Accessors, Create Method, and Remove Method

Check Generate Default View Object CheckBox