0% found this document useful (0 votes)
142 views454 pages

Oracle APEX Developer Professional Activity Guide D107336GC10

The document is an activity guide for Oracle APEX Developer Professional, outlining practices for getting started with Oracle APEX on the Oracle Autonomous Database. It includes instructions for provisioning an APEX workspace, installing sample applications, and various practices related to database application development. The guide emphasizes the low-code nature of APEX, allowing users to create applications rapidly without extensive coding knowledge.

Uploaded by

sadiq106
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
142 views454 pages

Oracle APEX Developer Professional Activity Guide D107336GC10

The document is an activity guide for Oracle APEX Developer Professional, outlining practices for getting started with Oracle APEX on the Oracle Autonomous Database. It includes instructions for provisioning an APEX workspace, installing sample applications, and various practices related to database application development. The guide emphasizes the low-code nature of APEX, allowing users to create applications rapidly without extensive coding knowledge.

Uploaded by

sadiq106
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 454

Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa

D107336GC10
Activity Guide
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a

Learn more from Oracle University at education.oracle.com


ide no
. n-tr
an
sfe
ra
bl e
lic
en
s e
to

Oracle APEX Developer Professional


Copyright © 2023, Oracle and/or its affiliates.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Disclaimer

This document contains proprietary information and is protected by copyright and other intellectual property laws.
The document may not be modified or altered in any way. Except where your use constitutes "fair use" under
copyright law, you may not use, share, download, upload, copy, print, display, perform, reproduce, publish, license,
post, transmit, or distribute this document in whole or in part without the express authorization of Oracle.

The information contained in this document is subject to change without notice and is not warranted to be error-
free. If you find any errors, please report them to us in writing.

to
Restricted Rights Notice

s e
en
If this documentation is delivered to the United States Government or anyone using the documentation on behalf of
the United States Government, the following notice is applicable:

lic
U.S. GOVERNMENT END USERS: Oracle programs (including any operating system, integrated software, any

bl e
programs embedded, installed or activated on delivered hardware, and modifications of such programs) and Oracle
computer documentation or other Oracle data delivered to or accessed by U.S. Government end users are

ra
"commercial computer software" or "commercial computer software documentation" pursuant to the applicable

sfe
Federal Acquisition Regulation and agency-specific supplemental regulations. As such, the use, reproduction,
duplication, release, display, disclosure, modification, preparation of derivative works, and/or adaptation of i) Oracle

an
programs (including any operating system, integrated software, any programs embedded, installed or activated on
delivered hardware, and modifications of such programs), ii) Oracle computer documentation and/or iii) other

. n-tr
Oracle data, is subject to the rights and limitations specified in the license contained in the applicable contract. The
terms governing the U.S. Government's use of Oracle cloud services are defined by the applicable contract for such
ide no
services. No other rights are granted to the U.S. Government.
Gu a

Trademark Notice
is as

Oracle and Java are registered trademarks of Oracle and/or its affiliates. Other names may be trademarks of their
th ) h

respective owners.
us .com

Intel and Intel Inside are trademarks or registered trademarks of Intel Corporation. All SPARC trademarks are used
under license and are trademarks or registered trademarks of SPARC International, Inc. AMD, Epyc, and the AMD
e

logo are trademarks or registered trademarks of Advanced Micro Devices. UNIX is a registered trademark of The
ail

Open Group.
gm

Third-Party Content, Products, and Services Disclaimer


6 @

This documentation may provide access to or information about content, products, and services from third parties.
10

Oracle Corporation and its affiliates are not responsible for and expressly disclaim all warranties of any kind with
respect to third-party content, products, and services unless otherwise set forth in an applicable agreement between
diq

you and Oracle. Oracle Corporation and its affiliates will not be responsible for any loss, costs, or damages incurred
due to your access to or use of third-party content, products, or services, except as set forth in an applicable
sa

agreement between you and Oracle.


i(

1006302023
Al
diq
Sa
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Table of Contents

Practice: Getting Started with Oracle APEX on the Oracle Autonomous Database ................. 5
Practice 1: Provision an APEX Workspace ...................................................................................... 6

to
Practice 2: Install and Run a Sample Application Overview ........................................................... 14

s e
Practice: Use SQL Workshop ......................................................................................................... 23

en
Practice 1: Install a Sample Data Set ............................................................................................... 24

lic
Practice 2: Add Columns to the PRODUCTS Table.......................................................................... 27

bl e
Practice 3: Create a Database Package for Business Logic ........................................................... 42

ra
Practice 4: Create Database Objects Using Quick SQL .................................................................. 51

sfe
Practice: Creating a Database Application.................................................................................... 63

an
Get Started ..................................................................................................................................... 64

. n-tr
Practice 1: Create an Application Based on Existing Tables .......................................................... 65
ide no
Practice 2: Create an Application from a Spreadsheet .................................................................. 81
Gu a

Practice: Working with Pages and Regions .................................................................................. 91


is as

Practice 1: Create Pages, Regions, and Items ................................................................................. 92


th ) h

Practice: Developing Reports ......................................................................................................... 111


us .com

Practice 1: Create an Interactive Grid and Smart Filters ................................................................. 112


Practice 2: Create Cards Regions and Faceted Search .................................................................. 121
e
ail

Practice: Managing and Customizing Interactive Reports .......................................................... 151


gm

Practice 1: Customize an Interactive Report as a Developer .......................................................... 152


@

Practice 2: Customize an Interactive Report as an End User ......................................................... 160


6
10

Practice: Managing and Customizing Interactive Grids .............................................................. 185


diq

Practice 1: Customize an Interactive Grid as a Developer .............................................................. 186


sa

Practice 2: Customize an Interactive Grid as an End User ............................................................. 197


i(

Practice: Creating Application Page Controls .............................................................................. 211


Al

Practice 1: Add Items and Buttons to a Page ................................................................................. 212


diq

Practice: Enhancing your application using Computations, Processes and Validations ........ 229
Sa

Practice 1: Add Branches, Validations, and Processes to the Shopping Cart Page ....................... 230
Practice: Creating and using Dynamic Actions ............................................................................ 239
Practice 1: Add Dynamic Actions, Computations, and Processes.................................................. 240
Practice: Managing Cards, Faceted Search, and Smart Filters................................................... 259
Practice 1: Improve Smart Filters Page ........................................................................................... 260
Practice 2: Improve and Customize the Faceted Search and Cards Regions ................................ 265

Copyright © 2023, Oracle and/or its affiliates.

Oracle Cloud Infrastructure Architect Professional Workshop – Table of Contents iii


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Practice: Creating and Using Forms .............................................................................................. 279


Practice 1: Create and Customize Forms ........................................................................................ 280
Practice: Implementing Navigation in your Application .............................................................. 291
Practice 1: Improve Application ...................................................................................................... 292
Practice: Using Themes and Themes Styles................................................................................. 307
Practice 1: Use Themes and Theme Styles .................................................................................... 308

to
e
Practice: Extending Application Capabilities................................................................................ 315

s
en
Practice 1: Manage Approvals Component .................................................................................... 316

lic
Practice: Managing Application Data ............................................................................................. 359

bl e
Practice 1: Manage Application Data .............................................................................................. 360

ra
Practice: Implement Security in your Application ........................................................................ 375

sfe
Practice 1: Create Authentication and Authorization Schemes ..................................................... 376

an
Practice: Adding Additional Pages to your Application .............................................................. 397

. n-tr
Practice 1: Adding Additional Pages to Your Application .............................................................. 398
Practice 2: Add Map to Your Application ....................................................................................... 415
ide no
Practice: Migrate Application Development Between Environments ......................................... 421
Gu a

Practice 1: Migrate Applications ..................................................................................................... 422


is as
th ) h

Practice 2: Remote Deployment ..................................................................................................... 438


us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

iv Oracle APEX Developer Professional – Table of Contents


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr
Database an
sfe
ra
bl e
lic
en
Oracle Autonomous

s e
to
with Oracle APEX on the
Practice: Getting Started
Practice 1: Provision an APEX Workspace
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Introduction

Oracle APEX is a low-code application platform for Oracle Database. APEX Application
Development, Autonomous Data Warehouse (ADW), and Autonomous Transaction Processing
(ATP) are fully managed services, pre-integrated and pre-configured with APEX, for rapidly

to
building and deploying modern data-driven applications in Oracle Cloud. Business users,

se
citizens, and application developers can create enterprise apps 20X faster with 100X less code

en
— without having to learn complex web technologies with just a browser. To start, you will

lic
need to decide on the service you are going to use for this workshop and then create an APEX

bl e
workspace accordingly.

ra
sfe
What is an APEX Workspace?

an
An APEX Workspace is a logical domain where you define APEX applications. Each workspace

. n-tr
is associated with one or more database schemas (database users) which are used to store the
database objects, such as tables, views, packages, and more. APEX applications are built on
ide no
top of these database objects.
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

6 Practice: Getting Started with Oracle APEX on the Oracle Autonomous Database
How do I find my APEX release version?
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

To determine which release of Oracle APEX you are currently running, do one of the following:
• View the release number on the Workspace home page:

o Sign in to Oracle APEX. The Workspace home page appears. The current
release version is displayed in the bottom right corner.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Getting Started with Oracle APEX on the Oracle Autonomous Database 7
• View the About APEX page:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

o Sign in to Oracle APEX. The Workspace home page appears.

o Click the Help menu at the top of the page and select About. The About APEX
page appears.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

Where to Run the Lab


e
ail

You can run this lab in any Oracle Database with APEX 23.1 installed. This includes the APEX
gm

Application Development Service, the free, "Development Only" apex.oracle.com service, your
@

on-premises Oracle Database (providing APEX 23.1 is installed), on a third-party cloud provider
6

where APEX 23.1 is installed, or even on your laptop by installing Oracle XE or Oracle VirtualBox
10

App Dev VM and installing APEX 23.1.


diq
sa

For this course, we will use the free, “Development Only” apex.oracle.com service.
i(
Al

Sign Up for apex.oracle.com


diq

Signing up for apex.oracle.com is simply a matter of providing details on the workspace you
Sa

wish to create and then waiting for the approval email.

1. Go to https://apex.oracle.com

Copyright © 2023, Oracle and/or its affiliates.

8 Practice: Getting Started with Oracle APEX on the Oracle Autonomous Database
2. Click Get Started for Free.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
3. Scroll down and you will see details for apex.oracle.com. Click Request a Free

sfe
Workspace.

an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Getting Started with Oracle APEX on the Oracle Autonomous Database 9
4. On the Request a Workspace dialog, enter your identification details – First Name, Last
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Name, Email, Workspace Name, Your Location, etc.


Now, please accept the Terms of the Oracle APEX Service Agreement and then Request
Workspace
Note: For workspace, enter a unique name, such as first initial and last name.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

10 Practice: Getting Started with Oracle APEX on the Oracle Autonomous Database
5. Check your email. You should get an email from apexext-noreply@ociapp-
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

notifications.oracle.com within a few minutes.

Note: If you don’t get an email go back to Step 3 and make sure to enter your email
correctly.
Within the email body, click Create Workspace.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Getting Started with Oracle APEX on the Oracle Autonomous Database 11
6. Click Continue to Sign In Screen.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
7. Enter your password, and click Change Password.

an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

12 Practice: Getting Started with Oracle APEX on the Oracle Autonomous Database
8. On the APEX Workspace login page, enter your password, select the Remember
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

workspace and username checkbox, and then click Sign In.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
9. You should now be in the APEX Builder.
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Summary

At this point, you know how to create an APEX Workspace and you are ready to start building
amazing apps, fast. You may now proceed to the next practice.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Getting Started with Oracle APEX on the Oracle Autonomous Database 13
Practice 2: Install and Run a Sample Application Overview
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

In this lab, you will navigate through the major components of Oracle APEX. This lab also
covers installing and running a sample application.

In this lab, you will:


• Navigate through the major Components of Oracle APEX

to
• Install and run a packaged application

se
en
Tasks

lic
bl e
Major Components of APEX

ra
sfe
To log in to Oracle APEX, you need a Workspace Name, username, and the password created
for that Workspace. In this hands-on lab, you log in to your Oracle APEX Workspace.

an
. n-tr
1. Log in to Oracle APEX Workspace. Perform the following steps:
ide no
a. Open your browser and enter the URL to sign in to the APEX development
environment.
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

14 Practice: Getting Started with Oracle APEX on the Oracle Autonomous Database
b. The login page appears. Enter the workspace name, username, and password.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Click Sign In.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm

2. The Workspace home page appears. Click App Builder.


6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Getting Started with Oracle APEX on the Oracle Autonomous Database 15
3. You do not have any applications listed right now. You can create a new app or install
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

a sample or starter app.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h

4. Click SQL Workshop.


us .com

The SQL Workshop home page appears. Review each of the SQL Workshop components.
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

16 Practice: Getting Started with Oracle APEX on the Oracle Autonomous Database
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
5. Click Gallery.

se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h

6. The Gallery page displays a collection of starter applications, sample applications and
us .com

custom applications that you can install in your workspace.


e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Getting Started with Oracle APEX on the Oracle Autonomous Database 17
Install a Sample Application
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Now, we will learn how to install and run a sample application.

1. Once you navigate to Gallery, click Sample Apps.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
2. ide no
Now that you are in Sample Apps, search for apps by typing "Reporting" into the "Search
Apps" search box and navigate to Sample Reporting and click the Install button.
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

18 Practice: Getting Started with Oracle APEX on the Oracle Autonomous Database
3. On the Install Application page, click the Install Application button.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Getting Started with Oracle APEX on the Oracle Autonomous Database 19
4. You can now see that the application is installed. Run the application by selecting Run
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Application.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

5. Log in to the Sample Reporting application as an end user.


e
ail

6. Enter your Username and Password (Same as your Workspace credentials) and click Sign
gm

In.
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

20 Practice: Getting Started with Oracle APEX on the Oracle Autonomous Database
7. You now see the Sample Reporting application home page. In your Runtime environment
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

under Developer Toolbar, click Home to return to the home page of the APEX
development environment.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq

8. Click App Builder.


sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Getting Started with Oracle APEX on the Oracle Autonomous Database 21
9. Toggle between the View Icons and the View Reports buttons. You see that applications
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

are displayed along with their icons and report format.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Summary

You now know how to navigate through the major components of Oracle APEX and install and
run a packaged application. You may now proceed to the next practice.

Copyright © 2023, Oracle and/or its affiliates.

22 Practice: Getting Started with Oracle APEX on the Oracle Autonomous Database
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr
an
sfe
ra
bl e
lic
en
s e
to
Practice: Use SQL Workshop
Practice 1: Install a Sample Data Set
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

In this practice, you learn to install sample tables and views from Sample Datasets. This
particular sample dataset is a collection of customers, stores, products, and orders used to
manage the shopping cart.

to
s e
In this practice, you will:

en
• Install a sample dataset into your Oracle APEX Workspace

lic
bl e
Task

ra
sfe
1. Log in to your workspace. If you are already logged in, click the APEX Logo in the upper
left-hand corner of the page to return to the APEX workspace home page.

an
. n-tr
Create Customer Order Tables
ide no
2. From the APEX workspace home page, select the down arrow to the right of SQL
Gu a

Workshop, then select Utilities to display the options and choose Sample Datasets.
is as
th ) h
us .com
e
ail
gm
@6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

24 Practice: Use SQL Workshop


3. On the Customer Orders row, click Install.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
4. Leave the settings to default and then click Next.

an
. n-tr
The schema name defaults to your current schema and hence will be different from the
schema name shown below. ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 25


5. Click Install Dataset.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
6. Click Exit.
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

You now know how to install sample tables and views from Sample Datasets. You may
now proceed to the next practice.

Copyright © 2023, Oracle and/or its affiliates.

26 Practice: Use SQL Workshop


Practice 2: Add Columns to the PRODUCTS Table
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

The PRODUCTS table includes some columns such as image, price, and details. But there are
other characteristics that customers would appreciate knowing about a product, such as color,
type of clothing, and department. In this practice, you will add these columns to the

to
PRODUCTS table.

se
en
Since many products share the same colors, clothing type, and department, to avoid data

lic
redundancy it is a best practice to create three additional tables to store the unique values of

bl e
color, type, and department data. Instead of creating these three tables for yourself, you'll use

ra
the Create Lookup Table feature.

sfe
In this practice, you learn how to add these three new columns to the PRODUCTS table and

an
then create lookup tables for those new columns.

. n-tr
In this practice, you will:
ide no
• Add new columns to the existing PRODUCTS table
Gu a
is as

• Populate the new columns


th ) h

• Create lookup tables


us .com
e
ail

Tasks
gm

Add Column Title to the PRODUCTS Table


6 @
10

1. From the APEX Main Menu, click SQL Workshop.


diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 27


2. Click Object Browser.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a

3. Navigate to PRODUCTS. Click the Add Column button.


is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

4. For the Color column, enter the following:


• Add Column - enter COLOR
• Type - select VARCHAR2
• Length - enter 200

Copyright © 2023, Oracle and/or its affiliates.

28 Practice: Use SQL Workshop


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Click Apply.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

5. Click the Add Column button.


e
ail

6. For the Department column, enter the following:


gm

• Add Column - enter DEPARTMENT


@

• Type - select VARCHAR2


6
10

• Length - enter 200.


diq

Click Apply.
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 29


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

7.

30
Sa
diq
Al
i(
sa
diq
10
6@

Click the Add Column button.


gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Use SQL Workshop


8. For the Clothing column, enter the following:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• Add Column - enter CLOTHING


• Type - select VARCHAR2
• Length - enter 200.
Click Next.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10

Populate New Columns


diq

1. From the APEX main menu, click SQL Workshop.


sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 31


2. Click SQL Scripts.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
3. Click Create.
ide no
Gu a
is as
th ) h
us .com

4. For Script Name, enter Populating new columns.


e
ail
gm

5. Copy the following script and paste it into the editor.


@

UPDATE
6
10

(
diq

SELECT p.product_id,
p.product_name,
sa

p.clothing,
i(

p.color,
Al

p.department,
diq

p.product_details
Sa

FROM products p ) p
SET p.clothing = Substr(product_name, Instr(product_name, '
',1,1)+1, Instr(product_name, ' ',1, 2)+1 - Instr(product_name,
' ',1,1)- 2),
p.color =
(
SELECT c.color

Copyright © 2023, Oracle and/or its affiliates.

32 Practice: Use SQL Workshop


FROM json_table (p.product_details, '$' COLUMNS (
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

color VARCHAR2(4000) path '$.colour') ) c),


p.department =
(
SELECT g.department
FROM json_table (p.product_details, '$' COLUMNS (
department VARCHAR2(4000) path '$.gender') ) g)

to
This script inserts the unique product type values (e.g. Shirt, Jacket, Skirt, etc.) into the

e
CLOTHING column in the PRODUCTS table. Similarly, it inserts the unique department

s
en
names (e.g. Boys’, Girls’, Men's, Women's) and color names into the DEPARTMENT and

lic
COLOR columns, respectively, based on information found in the JSON product details

bl e
column in the PRODUCTS table.

ra
6. Click Run.

sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 33


7. Click Run Now.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

8. The Script Results page is displayed listing the statements processed, successful, and with
errors.
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

34 Practice: Use SQL Workshop


9. To check the values in the PRODUCTS table, click SQL Workshop and click SQL
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Commands.

to
se
en
lic
bl e
ra
sfe
an
10. Copy the following SQL query.

. n-tr
SELECT p.product_name,
p.unit_price, ide no
p.color,
Gu a

p.department,
is as

p.clothing
th ) h

FROM products p;
us .com

11. Click Run.


e
ail
gm
6 @
10
diq
sa
i(
Al
diq

Create Lookup Tables


Sa

Since multiple products may have the same values for Color, Department, and Clothing, to
avoid repetition and make updates easy, you can create a lookup table for each. A lookup table
stores the value of the available colors, departments, or clothing in a single place, and then
each product can reference the value from the lookup table.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 35


In this practice, you create lookup tables based on the new three columns. After you create a
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

lookup table, this allows the PRODUCTS table to reference the new color, clothing type, and
department lookup value by its new numeric primary key value in the lookup table.

1. From the APEX main menu, click SQL Workshop.

2. Click Object Browser.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as

3. Navigate to the PRODUCTS table.


th ) h
us .com

4. Click the Create Lookup Table button.


e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

36 Practice: Use SQL Workshop


5. For Text Column, select COLOR and Click Create Lookup Table.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10

Note: Click the Create Lookup Table button only once. Then you will find the new table
diq

listed in the Object Browser.


sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 37


6. To create Department lookup table, navigate back to the Products table and
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Click More and Select Create Lookup Table button.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

38 Practice: Use SQL Workshop


7. For Text Column, select DEPARTMENT and Click Create Lookup Table.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10

Note: Click the Create Lookup Table button only once. Then you will find the new table listed in
diq

the Object Browser.


sa
i(

8. To create Clothing lookup table, navigate back to the Products table and Click More and
Al

Select Create Lookup Table button.


diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 39


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

9.

40
Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
For Text Column, select CLOTHING and Click Create Lookup Table.

lic
en
s e
to

Practice: Use SQL Workshop


Note: Click the Create Lookup Table button only once. Then you will find the new table listed in
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

the Object Browser.

10. The columns COLOR, DEPARTMENT, and CLOTHING in the Products table are renamed
to COLOR_ID, DEPARTMENT_ID, and CLOTHING_ID respectively, and their data type
changed to NUMBER. Also, there are new tables containing the values of the products:
• COLOR_LOOKUP

to
• DEPARTMENT_LOOKUP

se
• CLOTHING_LOOKUP

en
lic
The numeric value of the COLOR_ID column will now store a reference to the system

bl e
assigned unique ID of a particular color, whose name is stored in the new

ra
COLOR_LOOKUP table. Similarly, the DEPARTMENT_ID column references the ID of a row

sfe
in the DEPARTMENT_LOOKUP table and CLOTHING_ID references the ID of a row in the
CLOTHING_LOOKUP table.

an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq

You now know how to add new columns to your existing tables, how to create lookup tables
Sa

for reference information, and how to create and run a SQL script to populate your tables. You
may now proceed to the next practice.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 41


Practice 3: Create a Database Package for Business Logic
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

In this practice, you learn to create database objects to use in your APEX application. This
package contains functions and procedures to add products to the cart, remove products,
create an order, clear the cart, and more.

to
s e
To manage items in the cart, you use collections, which enable you to temporarily store

en
products currently in session state so they can be accessed, manipulated, or processed during

lic
a user's specific session.

bl e
Business logic in APEX applications can be written using PL/SQL, Oracle's procedural

ra
language extension to SQL. PL/SQL offers a handy program unit called a "package" that

sfe
allows you to cleanly separate the API signatures for a set of reusable procedures and

an
functions, from their implementation.

. n-tr
In this practice, you will: ide no
• Create a package to manage the Shopping Cart
Gu a
is as
th ) h

Task
us .com

Create the Package


e
ail
gm

Create specification and body for the package.


@

1. Navigate to SQL Workshop, and click Object Browser.


6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

42 Practice: Use SQL Workshop


2. Navigate to the Packages on the left side, Right click on it and Select Create Package.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
3. For Package Name, enter MANAGE_ORDERS and click Create Package.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 43


4. For Specification, replace the contents of the code editor with the following:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

CREATE OR replace PACKAGE manage_orders


AS
--------------------------------------------------------------
-- create procedure for add a product temporarily
PROCEDURE add_product (
p_product IN NUMBER,

to
p_quantity IN NUMBER);

e
--------------------------------------------------------------

s
en
-- create procedure for remove a product temporarily

lic
PROCEDURE remove_product (
p_product IN NUMBER);

bl e
--------------------------------------------------------------

ra
-- create function to get the number of items in the shopping

sfe
cart
FUNCTION Get_quantity

an
RETURN NUMBER;

. n-tr
--------------------------------------------------------------
ide no
-- create procedure for validate if a product exists in the
shopping cart
Gu a

FUNCTION Product_exists(
is as

p_product IN NUMBER)
th ) h

RETURN NUMBER;
us .com

--------------------------------------------------------------
-- create procedure for clear the cart
e
ail

PROCEDURE clear_cart;
gm

--------------------------------------------------------------
-- create function to validate a customer
@

FUNCTION Customer_exists(
6
10

p_customer_email IN VARCHAR2)
diq

RETURN NUMBER;
--------------------------------------------------------------
sa

-- create procedure to insert orders


i(

PROCEDURE create_order (
Al

p_customer IN VARCHAR2 DEFAULT NULL,


diq

p_customer_email IN VARCHAR2,
Sa

p_store IN NUMBER,
p_order_id OUT orders.order_id%TYPE,
p_customer_id OUT NUMBER );
END manage_orders;

Copyright © 2023, Oracle and/or its affiliates.

44 Practice: Use SQL Workshop


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

5.

Sa
diq

Practice: Use SQL Workshop


Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
Click Save and Compile to save the changes.

is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

45
6. Navigate to the body part of the package by clicking the Body tab and replace the
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

contents of the code editor with the following:


CREATE OR replace PACKAGE BODY manage_orders
AS
PROCEDURE add_product (p_product IN NUMBER,
p_quantity IN NUMBER)
IS

to
BEGIN

e
IF NOT apex_collection.collection_exists

s
en
(p_collection_name => 'PRODUCTS')
THEN

lic
apex_collection.create_collection(p_collection_name =>

bl e
'PRODUCTS');

ra
END IF;

sfe
apex_collection.add_member(p_collection_name =>

an
'PRODUCTS',

. n-tr
p_n001 => p_product,
p_n002 => p_quantity); ide no
END add_product;
Gu a
is as

PROCEDURE remove_product (p_product IN NUMBER)


th ) h

IS
us .com

l_id NUMBER;
BEGIN
e
ail

IF apex_collection.Collection_exists (p_collection_name =>


'PRODUCTS')
gm

THEN
@

SELECT seq_id
6

INTO l_id
10

FROM apex_collections a
diq

WHERE collection_name = 'PRODUCTS'


sa

AND a.n001 = p_product;


i(
Al

apex_collection.delete_member(p_collection_name =>
diq

'PRODUCTS',
p_seq => l_id);
Sa

END IF;
END remove_product;

FUNCTION get_quantity
RETURN NUMBER
IS

Copyright © 2023, Oracle and/or its affiliates.

46 Practice: Use SQL Workshop


l_items NUMBER := 0;
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

BEGIN
IF apex_collection.collection_exists (p_collection_name =>
'PRODUCTS')
THEN
SELECT SUM(n002)
INTO l_items
FROM apex_collections a

to
WHERE collection_name = 'PRODUCTS';

se
END IF;

en
lic
RETURN l_items;

bl e
END get_quantity;

ra
FUNCTION product_exists(p_product IN NUMBER)

sfe
RETURN NUMBER

an
IS

. n-tr
l_quantity NUMBER;
BEGIN ide no
IF apex_collection.collection_exists (p_collection_name =>
Gu a

'PRODUCTS')
is as

THEN
th ) h

SELECT a.n002
us .com

INTO l_quantity
FROM apex_collections a
e

WHERE collection_name = 'PRODUCTS'


ail

AND a.n001 = p_product;


gm
@

RETURN l_quantity;
6

ELSE
10

RETURN 0;
diq

END IF;
sa

EXCEPTION
i(

WHEN OTHERS THEN


Al

RETURN 0;
diq

END product_exists;
Sa

PROCEDURE clear_cart
IS
BEGIN
IF apex_collection.collection_exists (p_collection_name =>
'PRODUCTS')
THEN

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 47


apex_collection.truncate_collection(p_collection_name =>
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

'PRODUCTS');
END IF;
END clear_cart;

FUNCTION customer_exists(p_customer_email IN VARCHAR2)


RETURN NUMBER
IS

to
l_customer customers.customer_id%TYPE;

s e
BEGIN

en
SELECT customer_id

lic
INTO l_customer

bl e
FROM customers
WHERE email_address = p_customer_email;

ra
sfe
RETURN l_customer;

an
EXCEPTION

. n-tr
WHEN no_data_found THEN
RETURN 0; ide no
END customer_exists;
Gu a
is as

PROCEDURE create_order (p_customer IN VARCHAR2,


th ) h

p_customer_email IN VARCHAR2,
us .com

p_store IN NUMBER,
p_order_id OUT
e

orders.order_id%TYPE,
ail

p_customer_id OUT NUMBER)


gm

IS
@

BEGIN
6

p_customer_id := customer_exists(p_customer_email);
10
diq

IF p_customer_id = 0 THEN
sa

INSERT INTO customers


i(

(full_name,
Al

email_address)
diq

VALUES (p_customer,
p_customer_email)
Sa

returning customer_id INTO p_customer_id;


END IF;

INSERT INTO orders


(order_datetime,
customer_id,

Copyright © 2023, Oracle and/or its affiliates.

48 Practice: Use SQL Workshop


store_id,
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

order_status)
VALUES (SYSDATE,
p_customer_id,
p_store,
'OPEN')
returning order_id INTO p_order_id;

to
IF apex_collection.collection_exists (p_collection_name =>

se
'PRODUCTS')

en
THEN

lic
INSERT INTO order_items

bl e
(order_id,
line_item_id,

ra
product_id,

sfe
unit_price,

an
quantity)

. n-tr
SELECT p_order_id,
seq_id, ide no
p.product_id,
Gu a

p.unit_price,
is as

n002
th ) h

FROM apex_collections a,
us .com

products p
WHERE collection_name = 'PRODUCTS'
e
ail

AND p.product_id = a.n001;


gm

END IF;
@

apex_collection.delete_collection(p_collection_name =>
6

'PRODUCTS');
10

END create_order;
diq

END manage_orders;
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 49


7. Click Save & Compile.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
While you don't have to understand the code to complete the workshop successfully, know
that the functions and procedures you've defined in this practice are using a built-in feature of
Gu a
is as

Oracle APEX to handle the user's shopping cart by managing a collection of product id and
th ) h

quantity values specific to the current user, and automatically create a new row in
the Customers table during order creation if it's the first time the user is placing an order.
us .com

You now know how to create a package to manage the shopping cart. In the following
e
ail

practices, you will call these procedures and functions when it is required. You may
gm

now proceed to the next practice.


6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

50 Practice: Use SQL Workshop


Practice 4: Create Database Objects Using Quick SQL
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

Memorizing the SQL to create and maintain database objects can be difficult. However, there
are tools that can generate the code for you based on a shorthand syntax or a graphical user
interface. In this practice, you will create database objects using Quick SQL and then view the

to
objects in Database Actions. Then you will then use the Data Workshop page to load data from

se
a file into your workspace.

en
lic
In this practice, you’ll:

bl e
• Create database objects using Quick SQL

ra
• Load data using the Data Workshop page

sfe
Tasks

an
. n-tr
Create database objects using Quick SQL
ide no
1. Return to your APEX Workspace and click '⌄' next to the SQL Workshop tab, click
Gu a
is as

Utilities, and then select Quick SQL.


th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 51


2. Copy the following SQL shorthand code and paste it into the left pane in Quick SQL.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

departments /insert 4
name /nn
location
country
employees /insert 14
name /nn vc50

to
email /lower

e
cost center num

s
en
date hired

lic
job vc255

bl e
view emp_v departments employees

ra
sfe
Note that the Indentation from the code you copied should be similar to the one we have in the

an
following screenshot.

. n-tr
3. Review the shorthand code. How many tables will be created and how are they related?
ide no
What types of columns and constraints will be created for the tables? Note that
the Help button provides details on the shorthand syntax along with several examples of
Gu a
is as

its usage.
th ) h

When ready, in the Quick SQL (left pane) toolbar, click Generate SQL.
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

52 Practice: Use SQL Workshop


4. Review the SQL that is generated in the right-hand pane, and then click Settings to make
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

some changes to the resulting code.

It is important to save the SQL Shorthand as a script so that it can be run in your database.
In the SQL (right pane) toolbar, click Save SQL Script.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
5. In the Save Script dialog, for Script Name enter Employee Department Details, and
Gu a

click Save Script.


is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 53


6. Now that you saved the script you can run it to create the specified database objects.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

In the SQL (right pane) toolbar, click Review and Run.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
7. In the Script Editor page toolbar, click Run.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

54 Practice: Use SQL Workshop


8. On the Run Script page, click Run Now.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h

9. The Results page shows the results of running the script. Scroll to the bottom to see a
us .com

summary. You should not see any errors.


e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 55


10. To view the database objects that were created, click the arrow '⌄' in the SQL
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Workshop tab and then select Object Browser.

to
s e
en
lic
bl e
ra
11. Select the EMPLOYEES table and review its columns.

sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

56 Practice: Use SQL Workshop


12. Click the Data tab to see the data that was loaded.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
Load Data Using the Data Workshop Utility
ide no
In this step, you will learn how to create a table and Load data using the Data Workshop utility.
Gu a
is as

1. On the Workspace home page, click the '⌄' next to SQL Workshop tab, click Utilities, and
th ) h

then select Data Workshop.


us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 57


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

58
3.
2.

Sa
diq
Al
i(
sa
diq
10
6@
gm
ail

Under Upload a File, click Choose File.


us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
Under Get Started, click Load Data. The Load Data Wizard appears.

bl e
lic
en
s e
to

Practice: Use SQL Workshop


4. Download projects.csv and select the file.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
Note: If the uploaded XLSX file contains multiple worksheets, the Load Data wizard picks
the first sheet by default. To load another sheet, pick it from the Select Sheet select list.

ra
The First lines contains headers checkbox works similar to CSV files. The same is true for

sfe
the Configure dialog, the behavior is the same as it is for CSV files. Uploading XLSX files is

an
limited to 20 MB for each file.

. n-tr
5. Under Load Data, edit the Table Name field and provide an appropriate name. In this
ide no
practice, you will set the Table Name as Projects. Then click Load Data.
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 59


6. Once Data Loading is finished, a success message is displayed. If some rows cannot be
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

loaded to the target table, they will be stored to the error table and error table is displayed.
Then click View Table.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
7. Select the PROJECTS table and review its columns.
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

60 Practice: Use SQL Workshop


8. Click the Data tab to see the data that was loaded.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
This completes the practice. At this point, you know how to use Quick SQL to generate
database objects using a SQL shorthand. You also know how to use Data Workshop utility to
Gu a
is as

load data.
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 61


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

62
Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Use SQL Workshop


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr
an
sfe
ra
bl e
lic
en
Practice: Creating a

s e
Database Application

to
Get Started
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

In this lab, you will create a database application based on existing tables. You will also learn
how to create an APEX application using data imported from a spreadsheet.

to
In this lab, you’ll:

s e
en
1. Create an application using the tables and data that you already have installed

lic
2. Create a database application from a file

bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

64 Practice: Creating a Database Application


Practice 1: Create an Application Based on Existing Tables
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

In this practice, you will create a database application based on existing tables.

In this lab, you will:

to
e
• Create an application using the tables and data that you already have installed

s
en
• Create a database application from a file

lic
bl e
Tasks

ra
sfe
Sign in to the Oracle APEX Console using your workspace, username, and password.

an
Create an Application Based on Existing Tables

. n-tr
1. In the App Builder menu, click App Builder. ide no
Gu a

2. Click Create.
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating a Database Application 65


3. Click New Application.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
Name the Application ide no
Gu a

1. In the Create Application wizard, for “Name,” enter Online Shopping Application. Note
is as

that in the Create an Application wizard, the icon and color of the icon will be a random
th ) h

selection, so it most likely will not be the same color or icon that you see in the screenshot.
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Add the Dashboard Page

A Dashboard page is a great way to show important information using various charts. When you
installed the Sample Dataset, it also created a number of views, which join data from various
tables. These views are ideal as the basis for the dashboard charts.

Copyright © 2023, Oracle and/or its affiliates.

66 Practice: Creating a Database Application


1. In the Create Application wizard, click Add Page.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

2. Click Dashboard.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as

3. For Chart 1, enter the following:


th ) h

• Chart Type – select Bar


us .com

• Chart Name – enter Top 10 Products


• Table or View – select PRODUCT_ORDERS
e
ail
gm

• Label Column – select PRODUCT_NAME


• Type – select Sum
6 @

• Value Column – select TOTAL_SALES


10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating a Database Application 67


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

4. Click Chart 2, and enter the following:


e
ail

• Chart Type – select Pie


gm

• Chart Name – enter Top 5 Stores


@

• Table or View – select STORE_ORDERS


6
10

• Label Column – select STORE_NAME


diq

• Type – select Sum


sa

• Value Column – select TOTAL_SALES.


i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

68 Practice: Creating a Database Application


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

5. Click Chart 3, and enter the following:


e
ail

• Chart Type – select Pie


gm

• Chart Name – enter Order Status


@

• Table or View – select CUSTOMER_ORDER_PRODUCTS


6
10

• Label Column – select ORDER_STATUS


diq

• Type – select Count


sa

• Value Column – select ORDER_ID


i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating a Database Application 69


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

6. Click Chart 4, and enter the following:


• Chart Type – select Bar
e
ail

• Chart Name – enter Product Reviews


gm

• Table or View – select PRODUCT_REVIEWS


@

• Label Column – select PRODUCT_NAME


6
10

• Type – select Column Value


diq

• Value Column – select AVG_RATING


sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

70 Practice: Creating a Database Application


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq

Practice: Creating a Database Application


10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

71
7. Click Advanced and check Set as Administration Page.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@

8. Click Add Page.


6
10

Add Multiple Reports


diq

1. In the Create Application wizard, click Add Page.


sa
i(

2. Click the arrow to the left of Additional Pages to see additional page types.
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

72 Practice: Creating a Database Application


3. Click Multiple Reports.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@

4. On the Create Multiple Reports Page, select the following tables:


6
10

• CLOTHING_LOOKUP
diq

• COLOR_LOOKUP
sa

• CUSTOMERS
i(

• DEPARTMENT_LOOKUP
Al

• PRODUCT_REVIEWS
diq

• STORES
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating a Database Application 73


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

74
5.

Sa
diq
Al
Click Add Pages.

i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Creating a Database Application


Set Multiple Reports as Administration Pages
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

1. Edit each of the following pages to set it as an Administration Page:


• CLOTHING_LOOKUP
• COLOR_LOOKUP
• CUSTOMERS

to
• DEPARTMENT_LOOKUP

e
• PRODUCT_REVIEWS

s
en
• STORES

lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq

2. For each page you edit, click Advanced and check Set as Administration Page.
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating a Database Application 75


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

76
3.

Sa
diq
Al
i(
sa
Click Save Changes.

diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Creating a Database Application


Add Manage Products Page
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

1. In the Create Application wizard, click Add Page.

2. Click Interactive Report.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq

3. On the Report Page, enter the following:


sa

• Page Name - enter Manage Products


i(
Al

• Table - select PRODUCTS


diq

4. Click Advanced and check Set as Administration Page.


Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating a Database Application 77


5. Click Add Page.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@

Set Features
6
10

Features are a set of optional application capabilities in Oracle APEX that you can include in your
diq

new application. Access Control enables role-based user authorization with a single click.
sa

1. Under the Features section, check Install Progressive Web App and Access Control.
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

78 Practice: Creating a Database Application


Finish Creating the Application
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Now that you have added all the pages, it is time to generate the app and review it.

1. Scroll to the bottom of the page, and click Create Application.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm

2. Once the application is created, you will find the new app on the application home page.
Click Run Application.
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating a Database Application 79


Run the Application
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

1. Enter your user credentials. Click Sign In.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h

The new application will be displayed. Explore the pages that you just created by clicking the
us .com

navigation menu.
e
ail

You now know how to create an application with a number of different page types based on
gm

existing database objects. You may now proceed to the next lab.
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

80 Practice: Creating a Database Application


Practice 2: Create an Application from a Spreadsheet
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

In this lab, you will learn how to create an APEX application using data imported from a
spreadsheet.

Overview

to
In this lab, you build a simple application based on a spreadsheet. Keep in mind that APEX is

se
great for a variety of apps, from simple ones like this to large, sophisticated apps based on local

en
database objects, REST-enabled SQL objects, and even REST APIs.

lic
bl e
While APEX developers spend the majority of their time in the App Builder, you should also
investigate the SQL Workshop, where you can create and maintain database objects, Team

ra
Development, where you can track large APEX development projects, and the App Gallery,

sfe
which contains numerous productivity and sample apps that can be installed within minutes.

an
. n-tr
Tasks
ide no
Load Projects data
Gu a
is as

1. From your APEX workspace home page, click App Builder.


th ) h
us .com

2. Click Create a New App.


e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating a Database Application 81


3. Click From a File.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as

When creating an application from a file, APEX allows you to upload CSV, XLSX, XML, or JSON
th ) h

files and then build apps based on their data. Alternatively, you can also copy and paste CSV
us .com

data or load sample data.


e
ail

4. Within the Load Data wizard, click the Choose File button.
gm
@6
10
diq
sa
i(
Al
diq
Sa

5. Download and select the demo_projects.csv file from your local System

Copyright © 2023, Oracle and/or its affiliates.

82 Practice: Creating a Database Application


6. Review the parsed data. Enter DEMO_PROJECTS for Table Name and click Load Data.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
After clicking Load Data, you will see a spinner until the wizard finishes loading the data.
Continue to Task 2 at this point. ide no
Gu a

Create an application
is as
th ) h

The Data Load wizard has created a new table and populated that table with the records from
us .com

the sample data. Now you can create an app based on this new table.

1. In the Load Data dialog, verify that 70 rows have been loaded into the DEMO_PROJECTS
e
ail

Table, then click Create Application.


gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating a Database Application 83


2. Now you are going to remove the following pages from the Create an Application page.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• Demo Projects Search


• Demo Projects Report
• Calendar On the Create Application page. Click the Edit button next to Demo Projects
Search.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

84 Practice: Creating a Database Application


3. On the Add Faceted Search Page, click the Delete button and then confirm it by clicking OK.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10

Repeat the steps for Demo Projects Report and Calendar.


diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating a Database Application 85


4. Then click Create Application.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

When the wizard finishes creating the application, you will be redirected to the application's
home page in the App Builder.
e
ail

Configure Progressive Web App Attributes


gm
@

1. Navigate to the Edit Application Definition page. From the Application home page, you can
6

access the Edit Application Definition page using Shared Components.


10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

86 Practice: Creating a Database Application


2. On the Shared Components page, under User Interface, select Progressive Web App.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
3. Now, navigate to Progressive Web App and set Installable to Yes. Click Apply Changes.

sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating a Database Application 87


Run and Explore the New App
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

1. Navigate back to DEMO_PROJECTS application and then click Run Application. This will
open the runtime application in a new browser tab, allowing you to see how end users will
view the app.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
2. Enter your user credentials and click Sign In.
Gu a
is as

Note: Use the same Username and Password you used to sign in to the APEX Workspace.
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

88 Practice: Creating a Database Application


3. Click the Install App Icon on the top right of the page to install the application to your local
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

system.

to
se
en
lic
bl e
ra
sfe
an
You now know how to create an application from a spreadsheet by either dragging and

. n-tr
dropping a file or loading sample data for training purposes.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating a Database Application 89


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

90
Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Creating a Database Application


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr
an
sfe
ra
bl e
lic
Pages and Regions

en
s e
to
Practice: Working with
Practice 1: Create Pages, Regions, and Items
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

In this lab, you open the home page in page designer, and navigate through and review the
page designer panes. Then, you create a new page that allows customers to view the details of
their recent order. Customers will find the following details of the order:

to

e
Order number

s
en
• Order date

lic
• Status

bl e
• Total price

ra
• Quantity and price of the items.

sfe
In this lab, you will:

an
1. Navigate and review the Page Designer panes

. n-tr
2. Create a page to review the items that customer just bought
ide no
Gu a

Downloads:
is as
th ) h

• Did you miss out trying the previous labs? Don’t worry! You can download the application
from here and import it into your workspace. To run the app, please run the steps
us .com

described in Get Started with Oracle APEX and Using SQL Workshop workshops.
e
ail
gm

Tasks
@

Navigate and Review the Page Designer panes


6
10
diq

Open the home page in page designer, and navigate through and review the page designer
panes.
sa
i(

1. In the App Builder, run the Online Shopping Application. You are now in the application
Al

runtime environment. Use the application menu to navigate to the Home page. In the
diq

Developer Toolbar, click Page n.


Sa

Note: If you are not on the Home page then the Developer Toolbar will show the current
page number, and clicking Edit Page xx will navigate to that page, instead of Page n.

Copyright © 2023, Oracle and/or its affiliates.

92 Practice: Working with Pages and Regions


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
2. The Page Designer is displayed for Page 1. There are three main panes within Page
Designer: Left Pane, Central Pane, and Right Pane. You can change the size of each pane
ide no
by selecting the dividers and sliding them left or right. Change the size of Grid Layout and
Gu a

Gallery by sliding the divider between them up and down.


is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Working with Pages and Regions 93


3. In the Page Designer, you can invoke help on any attribute by clicking Help on the toolbar.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Select a component and then select an attribute in the Property Editor to display help on
that attribute.

For example, in this screenshot, you select Online Shopping Application in the Rendering
tree on the left, and then select Sequence > Layout in the Property Editor on the right. The
help text for Sequence is displayed.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

4. In the page designer, click Create (the + icon) and select Page.
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

94 Practice: Working with Pages and Regions


Create a Normal Page - Order Information
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Create a Normal Page to review the order that the customer has made.

1. In the Create a Page dialog, select Blank Page and click Next.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq

2. Enter the following:


• Page Number - enter 15
sa
i(

• Name - enter Order Information


Al

Now, click Navigation, and enter the following.


diq

• Breadcrumb - Set to No
Sa

• Navigation - Set to Yes. Click Create Page.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Working with Pages and Regions 95


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail

Add a Region
gm

Add a region to the page to display order details.


6@
10

1. On the new page created, navigate to the Gallery Menu at the bottom of the page
diq

showing Regions, Items, and Buttons categories and ensure that Regions is selected.
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

96 Practice: Working with Pages and Regions


2. Drag a Static Content region and drop it to the Body section.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
3. In the Property Editor, enter the following:

. n-tr
• For Title - enter Thank you for your order! ide no
• For Template - select Content Block
Gu a

• For Template Options - Click the rectangular area next to the Template Options label
is as

to open the Template Options dialog. On the Dialog page, select Show Region
th ) h

Icon and click OK.


us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Working with Pages and Regions 97


• For Icon, enter fa-heart.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm

Add Items to the Page


@

Add a hidden item to store the order ID without the user being able to see it.
6
10

1. In the Rendering tree (left pane), click the Thank you for your order! region to select it.
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

98 Practice: Working with Pages and Regions


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

2.

Sa
diq
Al
i(
sa
diq

Practice: Working with Pages and Regions


10
6@
gm
ail
us .com
e
th ) h
is as
Right-click the region and click Create Page Item.

Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

99
3. In the property editor, set the name and type as follows:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Table 1: Work with Pages and Regions | Lab 1: Create Pages, Regions and Items

Name Type

P15_ORDER Hidden

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

Add Static Content Region


e
ail
gm

Add a region to contain Order details and items.


6@

1. In the Rendering tree (left pane), click the Thank you for your order! region.
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

100 Practice: Working with Pages and Regions


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

2.

Sa
diq
Al
i(
sa
diq

Practice: Working with Pages and Regions


10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
Right-click the region and click Create Sub Region.

ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

101
3. In the Property Editor, enter the following:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• For Title - enter the expression (including the period) Order: &P15_ORDER.
• For Type - select Static Content

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

Add Order Details Region


e
ail
gm

Add a region to display Order details.


@

1. In the Rendering tree (left pane), navigate to the Order: &P15_ORDER. region.
6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

102 Practice: Working with Pages and Regions


2. Right-click the region and click Create Sub Region.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
3. In the Property Editor, enter the following:
Gu a
is as

• For Title - enter Order Details


th ) h

• For Type - select Cards


us .com

• Under Source section:


 For Type - select SQL Query
e
ail

 For SQL Query - enter the following SQL Query:


gm
@

SELECT o.order_id,
6
10

o.order_datetime,
o.customer_id,
diq

o.order_status,
sa

o.store_id,
i(

(SELECT Sum(unit_price * quantity)


Al

FROM order_items i
diq

WHERE i.order_id = o.order_id) total


Sa

FROM orders o
WHERE order_id = :P15_ORDER

Copyright © 2023, Oracle and/or its affiliates.

Practice: Working with Pages and Regions 103


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h

4. Click Attributes.
us .com

• Search for Secondary Body in the filter and do the following:


 Set Advanced Formatting to On
e
ail

 For HTML Expression - enter:


gm
@

<b> Order Placed:</b> &ORDER_DATETIME. <br>


6

<b> Status: </b>&ORDER_STATUS. <br>


10

<b> Total: </b>&TOTAL.


diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

104 Practice: Working with Pages and Regions


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as

Add Items Region


th ) h

Add a region to display items in the order.


us .com

1. In the Rendering tree (left pane), navigate to the Order: &P15_ORDER. region.
e
ail
gm

2. Right-click the region and click Create Sub Region.


6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Working with Pages and Regions 105


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

3. In the Property Editor, enter the following:


e
ail

• For Title - enter Items


gm

• For Type - select Cards


@

• Under Source section:


6
10

 For Type - select SQL Query


diq

 For SQL Query - enter the following SQL Query:


sa

SELECT o.line_item_id Item,


i(

p.product_name Product,
Al

o.unit_price,
diq

o.quantity,
( o.unit_price * o.quantity ) Subtotal,
Sa

p.product_image
FROM order_items o,
products p
WHERE p.product_id = o.product_id
AND order_id = :P15_ORDER

Copyright © 2023, Oracle and/or its affiliates.

106 Practice: Working with Pages and Regions


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h

4. Click Attributes and do the following:


us .com

• Under Title section:


e
ail

o For Column - select PRODUCT


gm

• Under Secondary Body:


@

o Set Advanced Formatting to On


6

o For HTML Expression - enter:


10
diq

<b>Quantity: </b> &QUANTITY. <br>


sa

<b>Unit Price: </b>&UNIT_PRICE.


i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Working with Pages and Regions 107


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as

• Under Media section:


th ) h

o For Source - select BLOB Column


us .com

o For BLOB Column - select PRODUCT_IMAGE


o For Position - select Body
e
ail

o For Appearance - select Auto


gm

o For Sizing - select Fit


6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

108 Practice: Working with Pages and Regions


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
• Under Card:
ide no
Gu a

o For Primary Key Column - Select ITEM.


is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq

5. Click Save.
Sa

You now know how to add a new page to your existing APEX Application and add regions to
define the page's content using the Page Designer. You may now proceed to the next lab.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Working with Pages and Regions 109


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

110
Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Working with Pages and Regions


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr
an
sfe
ra
bl e
lic
en
s e
to
Practice: Developing Reports
Practice 1: Create an Interactive Grid and Smart Filters
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

In this practice, you navigate to the Demo Projects application and create an Interactive
Grid page and a Smart Filters page, which will help you search for and edit projects and tasks.

to
Downloads

s e
• Did you miss out on trying the previous practices? Don’t worry! You can download the

en
application from here and import it into your workspace. To run the app, follow the

lic
steps described in the Get Started with Oracle APEX and Using SQL

bl e
Workshop workshops.

ra
sfe
Tasks

an
Add an Interactive Grid to the Demo Projects Application

. n-tr
ide no
In this practice, you create an Interactive Grid page on the DEMO_PROJECTS table in the Demo
Projects application. You already created the Demo Projects application in HOL-3.
Gu a
is as

1. On the Workspace home page, click App Builder. Select the Demo Projects application.
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

112 Practice: Developing Reports


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

3.
2.

Sa
diq
Al

Practice: Developing Reports


i(
Click Create Page.

sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
Under Create a Page, select Component and then select Interactive Grid.

s e
to

113
4. For Page Attributes, enter/select the following:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Under Page Definition:


• Page Number: 4
• Page Name: Project Tasks

Under Data Source:

to
• Table/View Name: DEMO_PROJECTS

s e
en
Under Navigation:

lic
• Use Breadcrumb: No

bl e
ra
sfe
Click Create Page.

an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@
6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

114 Practice: Developing Reports


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
5. Now that you have created an Interactive Grid page, you can view it by clicking
Gu a

Save and Run Page on the top right.


is as
th ) h
us .com
e
ail
gm
@6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 115


Add Smart Filters to the Demo Projects Application
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

In this practice, you create a Smart Filters report on the DEMO_PROJECTS table in the Demo
Projects application. You already created the Demo Projects application in HOL-3.

1. Navigate to the Create (+) button and click Page.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

116 Practice: Developing Reports


2. Under Create a Page, select Component and then select Smart Filters.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail

3.
gm

For Create Smart Filters, enter/select the following:


@

Under Page Definition:


6
10

• Page Number: 8
diq

• Name: Project Tasks Search


sa

Under Data Source:


i(
Al

• Table/View Name: DEMO_PROJECTS


diq

Under Navigation:
Sa

• Use Breadcrumb: No

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 117


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

118
Sa
Click Next.

diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Developing Reports


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

4.


Sa
diq
Al

Practice: Developing Reports


i(
sa
diq
Click Create Page

10
6@
On the Select the Filters page:

gm
ail
us .com
e
th ) h
is as
Leave the remaining details to the defaults

Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

119
5. Now that you have created a Smart Filters page, you can view it by clicking Save and Run
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Page.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h

You now know how to create an Interactive Grid page and a Smart Filters page. You may
us .com

now proceed to the next practice.


e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

120 Practice: Developing Reports


Practice 2: Create Cards Regions and Faceted Search
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

In this practice, you create:


• Application Items and an Application Process

to
• A Cards page to view Product Details and Customer Reviews in the online Shopping

e
Cart application

s
en
• A Faceted Search page to view Products

lic
Tasks

bl e
ra
Create Application Items

sfe
an
This is needed to count the number of items in the shopping cart and the icon to display in the

. n-tr
navigation bar.

1.
ide no
Navigate to Online Shopping Application and click Shared Components.
Gu a
is as
th ) h
us .com
e
ail
gm
@6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 121


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

3.
2.

122
Sa
diq

Click Create.
Al
i(
sa
diq
10
6 @
gm
ail
us .com
e
th ) h
is as
Gu a
Under Application Logic, click Application Items.

ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Developing Reports


4. Create two items as follows:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Table 1: Develop Reports | Practice 2: Create Cards Regions and Faceted Search

Name Scope

SHOPPING_CART_ICON Application

to
e
SHOPPING_CART_ITEMS Application

s
en
lic
bl e
5. Click Create Application Item and create the second item.

ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@6
10
diq
sa
i(
Al
diq
Sa

Create the Application Process

This process is needed to refresh the number of items in the shopping cart, which will be shown
in the navigation bar.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 123


1. Click Shared Components.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
2. Under Application Logic, click Application Processes.

bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@

3.
10

Click Create and enter/select the following:


diq

• Name: Initialize Shopping Cart Header


sa

• Process Point: On Load: Before Header (page template header)


i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

124 Practice: Developing Reports


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

4. Click Next.
e
ail

5. For Code, enter:


gm

-- Initialize shopping cart navigation bar to show appropriate


@

icon and count


6

DECLARE
10

l_cnt NUMBER := manage_orders.get_quantity;


diq

BEGIN
sa

IF l_cnt > 0 THEN


i(

:SHOPPING_CART_ITEMS := l_cnt;
Al

:SHOPPING_CART_ICON := 'fa-cart-full';
diq

ELSE
:SHOPPING_CART_ITEMS := '';
Sa

:SHOPPING_CART_ICON := 'fa-cart-empty';
END IF;
END;

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 125


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

6.

126
Sa
Click Next.

diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Developing Reports


7. Click Create Process.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm

Create a Normal Page - Shopping Cart


@

The shopping cart page allows users to review and edit the products in the cart. Users can also
6
10

create an order or clear the shopping cart.


diq

1. Click Application Home. The ID of your application may vary.


sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 127


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

3.
2.

128
Sa
diq
Al
i(
Click Create Page.

sa
diq
10
6@
gm
ail Select Blank Page and click Next.
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Developing Reports


4. For Create Blank Page, enter/select the following:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Under Page Definition:

• Page Number: 16
• Name: Shopping Cart

to
Under Navigation:

e
• Use Breadcrumb: No

s
en
• Use Navigation: No

lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@6
10
diq
sa
i(
Al
diq
Sa

Add a Cards Region

This region will list the items that have been added temporarily to the shopping cart.

1. On the new page created, navigate to the Gallery Menu.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 129


2. Drag a Cards region and drop it into the Body section.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
3. In the Property Editor, enter/select the following:
ide no
Under Identification:
Gu a
is as

• Title: Shopping Cart


th ) h
us .com

Under Source:
• Type: SQL Query
e
ail

• SQL Query:
gm

SELECT seq_id item,


@

p.product_image,
6

p.product_id,
10

p.product_name name,
diq

p.unit_price,
sa

n002 quantity,
i(

p.unit_price* n002 subtotal,


Al

b.brand
diq

FROM apex_collections a,
products p,
Sa

json_table (p.product_details, '$' columns ( brand


varchar2(4000) path '$.brand') ) b
WHERE collection_name = 'PRODUCTS'
AND p.product_id = a.n001

Copyright © 2023, Oracle and/or its affiliates.

130 Practice: Developing Reports


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

4. Click Attributes and enter/select the following:


e
ail

Under Appearance:
gm

• Layout: Horizontal (Row)


@

Under Title:
6
10

• Column: NAME
diq

Under Subtitle:
sa

• Column: BRAND
i(

Under Body:
Al

• Advanced Formatting: On
diq

• HTML Expression:
Sa

Quantity: &QUANTITY.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 131


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

Under Secondary Body:


e
ail

• Advanced Formatting: On
gm

• HTML Expression:
@

<b>Unit Price: &UNIT_PRICE. </b> <BR>


6
10

<b>Subtotal: &SUBTOTAL. </b>


diq

Under Media:
sa

• Source: BLOB Column


i(

• BLOB Column: PRODUCT_IMAGE


Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

132 Practice: Developing Reports


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

Under Messages:
e
ail

• When No Data Found: Your shopping cart is empty!


gm

• For No Data Found Icon: fa-cart-empty


@

Under Card:
6
10

• Primary Key Column 1: ITEM


diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 133


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Add an Action to the Shopping Cart

This action allows customers to open a page to edit a particular item in the shopping cart.

1. In the Rendering tree (left pane), navigate to Actions under Shopping Cart.

Copyright © 2023, Oracle and/or its affiliates.

134 Practice: Developing Reports


2. Right-click Actions and select Create Action.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h

3. In the Property Editor:


us .com

• For Label, enter Edit.


• For Target, enter No Link Defined.
e
ail
gm

• For Page, enter 17.


{Note: Page 17 will be created in the next practice}
@6

• Set items as follows:


10

Table 2: Develop Reports | Practice 2: Create Cards Regions and Faceted Search
diq
sa

Name Value
i(
Al

P17_PRODUCT_ID &PRODUCT_ID.
diq
Sa

• Click OK.
• For Display Type, select Text with Icon.
• For Icon, select fa-cart-edit.
Click Save.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 135


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
This configures the (Edit) button to open page 17, passing the value of the PRODUCT_ID column
ide no
of the current card as the value for the P17_PRODUCT_ID page item in the called page.
Gu a
is as
th ) h

Create a Modal Page


us .com

This is to add products to the cart.


e
ail

1. Navigate to the Create (+) button and click Page.


gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

136 Practice: Developing Reports


2. Select Blank Page and click Next.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@6
10

3. Enter/select the following and click Create Page.


diq
sa

• Page Number: 17
i(

• Name: Add to Cart


Al

• Page Mode: Modal Dialog


diq
Sa

Click Create Page.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 137


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@

Add a Cards Region for Product Details


6
10

This region allows users to review the details of a product, such as brand, price, description, and
diq

more.
sa

1. On the new modal page created, navigate to the Gallery Menu.


i(
Al

2. Drag a Cards region and drop it into the Content Body section.
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

138 Practice: Developing Reports


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
3. In the Property Editor, enter/select the following:

. n-tr
• Title: Product
Under Source: ide no
• Type: SQL Query
Gu a
is as

• SQL Query:
th ) h

SELECT product_id,
us .com

product_name,
unit_price,
e
ail

product_details,
gm

product_image,
image_mime_type,
@

image_filename,
6
10

image_charset,
image_last_updated,
diq

color_id,
sa

department_id,
i(

clothing_id,
Al

d.description,
diq

b.brand
Sa

FROM products p,
json_table (p.product_details, '$' columns (
description varchar2(4000) path '$.description') ) d,
json_table (p.product_details, '$' columns ( brand
varchar2(4000) path '$.brand') ) b
WHERE product_id = :p17_product_id

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 139


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

140



Sa
diq

Click OK.
Al

Style: Style C
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as

Template Options: Use Template Defaults


Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Developing Reports


4. Click Attributes and select the following:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• Under Appearance: For Layout, select Float.


• Under Title: For Column, select PRODUCT_NAME.
• Under Subtitle: For Column, select BRAND.
• Under Body: For Column, select DESCRIPTION.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 141


• Under Secondary Body:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

1) Set Advanced Formatting to On. For HTML Expression, enter the following:
Price: &UNIT_PRICE.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

142 Practice: Developing Reports


• Under Card: For Primary Key Column 1, select PRODUCT_ID.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
Add a Cards Region for Customer Reviews
ide no
This region lets users read the customer reviews for a product.
Gu a
is as

1. Navigate to the Gallery Menu.


th ) h

2. Drag a Cards region and drop it into the Content Body section under the Product region.
us .com
e
ail
gm
@6
10
diq
sa
i(
Al
diq
Sa

3. In the Property Editor, enter/select the following:


• Title: Customer Reviews

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 143


Under Source:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• Type: SQL Query


• SQL Query:
SELECT m.rating,
m.review
FROM products p,
product_reviews m

to
WHERE p.product_name = m.product_name

s e
AND p.product_id = :p17_product_id

en
order by m.rating desc

lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

144 Practice: Developing Reports


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
4. Click Attributes and enter/select the following:

. n-tr
Under Appearance:
• Layout: Horizontal (Row) ide no
Gu a

Under Title:
is as

• Advanced Formatting: On
th ) h

• HTML Expression:
us .com

<b>Review:</b> &REVIEW. <br>


<b>Rating:</b> &RATING.
e
ail
gm
@6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 145


• Under Messages:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• When No Data Found: There are no customer reviews yet.

to
s e
en
5. Click Save.

lic
Add the Products Page

bl e
ra
1. Navigate to the Create button (+) and click Page.

sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

146 Practice: Developing Reports


2. Select Faceted Search and then click Next.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@

3. Enter/select the following and click Next:


6
10

Under Page Definition:


diq

• Page Number: 19
sa

• Name: Products
i(
Al

Under Data Source:


diq

• Table/View Name: PRODUCTS


Sa

Under Navigation:
• Use Breadcrumb: No

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 147


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

148
Click Next.
Sa
diq
Al
i(
sa
diq
10
6 @
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Developing Reports


4. For Facet Selection, next to Display as, select Cards. Leave the remaining options as their
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

defaults and click Next.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@6
10
diq

5. Under Create Faceted Search, select the following:


sa

• Select Grid
i(

• Title Column: PRODUCT_NAME


Al

• Body Column: - Select Column - (to deselect the default column chosen)
diq

• Click Create Page.


Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 149


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@

You now know how to create an application item, an application process, a Faceted Search page,
6

and a Cards page. You may now proceed to the next practice.
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

150 Practice: Developing Reports


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
Reports
. n-tr
an
sfe
ra
bl e
lic
en
s e
to
Practice: Managing and
Customizing Interactive
Practice 1: Customize an Interactive Report as a Developer
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

In this practice, you will manage and customize the Interactive Report page in the Sample
Reports application as a Developer.

to
e
Downloads

s
en
• Did you miss out on trying the previous practices? Don’t worry! You can download the

lic
application from here and import it into your workspace. To run the app, follow the

bl e
steps described in the Get Started with Oracle APEX and Using SQL
Workshop workshops.

ra
sfe
an
Tasks

. n-tr
Customize an Interactive Report as a Developer ide no
Gu a

1. In this practice, you edit an interactive report in page designer and customize it for end
is as

users. First, view the Interactive Report in page designer. In the Developer Toolbar,
th ) h

click Edit Page.


us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

152 Practice: Managing and Customizing Interactive Reports


2. When end users click the edit icon for a specified row, they should be directed to a page
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

that shows the column values for that row. The interactive report currently has a link
column to a form page. Modify your interactive report to have a link to a single row view.

a. Under Rendering, navigate to the Projects interactive report and then on the
Property Editor, select Attributes. Under Link, for Link Column, select Link to Single
Row View. Click Save and Run Page.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

b. In the report, ensure that you have selected 1. Primary Report in the report toolbar.
Click the edit icon (pencil) for any row.
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Reports 153


c. The details of maintaining the project are displayed. Click the Cancel button to return
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to the report.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

3. The current pagination type of the interactive report is Row Ranges X to Y. Assume you
want to always show your end users the total number of rows in the report as part of the
e
ail

pagination display. In the Developer Toolbar, click Edit Page.


gm
@

a. Under Rendering, navigate to the Projects interactive report and select Attributes in
6

the Property Editor.


10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

154 Practice: Managing and Customizing Interactive Reports


b. In the Property Editor, under Attributes, search for Pagination. For Type, select Row
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Ranges X to Y of Z.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
4. You want to customize the display of the Search Bar. End users should be able to select the
ide no
display of the desired number of rows per page.
Gu a
is as

In the Property Editor, locate Search Bar under Attributes. Perform the following:
th ) h

• Enable Rows Per Page Selector.


us .com

• Enter 10 for Maximum Rows Per Page.


e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Reports 155


5. You want to disable Email in the Download option of the Actions menu. In the Property
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Editor, navigate to Download. Deselect the Send as Email download format.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h

6. You want to enable Excel and PDF formats in the Download option of the Actions menu. In
us .com

the Property Editor, navigate to Download. Select the Excel and PDF download formats.
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

156 Practice: Managing and Customizing Interactive Reports


7. Now that you have finished the customization for end users, click Save and Run Page.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

8. Notice that the row selector and the new pagination type are available in the report.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
9. Select Actions > Report > Save Report.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq

10. The Save Report dialog box is displayed. Notice that the Public check box is now available.
Sa

Perform the following:


• Save: Select As Named Report
• Name: Enter Projects Public Report
• Enable the Public check box.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Reports 157


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
11. This report is now saved as a public report for all users and is available in the Reports drop-
down list.

an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa

12. Click Actions > Download.


i(

13. Notice that the Excel and PDF formats are available. Click the Close icon.
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

158 Practice: Managing and Customizing Interactive Reports


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm

14. From the Reports drop-down list, select Primary Report.


6 @

You now know how to manage and customize the interactive report as a developer. You
10

may now proceed to the next practice.


diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Reports 159


Practice 2: Customize an Interactive Report as an End User
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

In this practice, you will manage and customize the Interactive Report page in the Sample
Reports application as an End User.

to
Tasks

s e
en
Customize an Interactive Report as an End User

lic
bl e
1. To start, run the Sample Reporting application. Click App Builder.

ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

2. Navigate to Sample Reporting and then click Run Application.


e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

160 Practice: Managing and Customizing Interactive Reports


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
3. In the navigation menu or in the Cards Region, click Interactive Report.

an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq

4. Assume that you do not want to display the Start Date and End Date columns in the report.
sa

Also, you want the Status column to display just after the Assigned To column. Perform
i(

the following steps:


Al
diq

a. Click Actions and select Columns.


Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Reports 161


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
b. The Select Columns dialog box appears. The columns on the right are displayed, and

. n-tr
the columns on the left are hidden. Select Start Date and End Date in the Display in
Report group, and move the selected columns into the Do Not Display list by clicking
ide no
the left arrow (<).
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

162 Practice: Managing and Customizing Interactive Reports


c. You can reorder the displayed columns by using the arrows on the far right.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Select Status in the Display in Report group and click the down arrow once. Then,
click Apply.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Reports 163


d. The interactive report is displayed with the changes made in the previous steps.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
5. Next, let's say you want to filter the report results. First, you want to filter the report to
display rows that meet the criteria Cost <= 2000. Within these filtered results, you then
ide no
create another filter to display rows with Project is Bug Tracker. Perform the following
Gu a

steps:
is as
th ) h

a. Click Actions and select Filter.


us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

164 Practice: Managing and Customizing Interactive Reports


b. Under Filter, enter/select the following:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• Column: Cost
• Operator: <=
• Expression: 2000
Then, click Apply.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
c. Next, add the second filter on the Project column. Click the Actions menu and
select Filter.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

d. Under Filter, select the following:


• Column: Project
• Operator: =
• Expression: Bug Tracker
Click Apply.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Reports 165


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
e.
ide no
Notice that two filters are applied. Fewer rows are displayed because only the rows that
Gu a

meet both the filter criteria are displayed. You can remove each filter by clicking the
is as

Remove Filter icon, next to the filter you want to remove.


th ) h

Click the Remove Filter icon next to both the filters.


us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

166 Practice: Managing and Customizing Interactive Reports


6. Now imagine you want to sort the report on the Cost column.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

a. Select Actions > Data > Sort.

to
se
en
lic
bl e
ra
sfe
b. Remove the existing sort columns under Column by using the select list in rows 2 and

an
3 of Column to restore the value to the default, Select Column.

. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Reports 167


c. Select Cost for Column, Descending for Direction, and click Apply.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
d. The report is now sorted in Descending order of Cost.

. n-tr
7. ide no
Create an aggregation against the Available Budget column. You want to display the sum
of the Available Budget.
Gu a
is as

a. Select Actions > Data > Aggregate.


th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

168 Practice: Managing and Customizing Interactive Reports


b. In the Aggregate dialog box, select Sum for Function and Available Budget for
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Column. Click Apply to add the aggregation at the end of the last column of the report.

to
se
en
lic
bl e
ra
c. The aggregate function is applied on the column. Notice that the sum of Available

sfe
Budget is displayed at the end of the report under the column. Navigate until the last

an
page to view the sum.

. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail

8. In the report, assume you want to include Cost calculated with tax. The computation you
gm

want to make is Cost * 1.05. You create a computed column in the interactive report.
@

a. Select Actions > Data > Compute.


6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Reports 169


b. The Compute dialog box appears.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• For Column Label, enter Cost with Tax.


• For Computation Expression, click Cost under Column Aliases. Click *1.05 in the
Keypad.
Click Apply.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

170 Practice: Managing and Customizing Interactive Reports


c. The new computed column Cost with Tax now appears in the report.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
9. Create a control break on the Project column.

an
a. Select Actions > Format > Control Break.

. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Reports 171


b. In the Control Break dialog box, in row number 1, select Project for Column and
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

click Apply.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
c. The control break is now applied. Notice that the aggregation you created in a previous
ide no
step appears at the end of each control break.
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

172 Practice: Managing and Customizing Interactive Reports


10. Let's say you want to highlight rows with a Cost value of less than or equal to 500. You add
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

highlights to rows while continuing with the control break that you created in the previous
step.

a. Select Actions > Format > Highlight.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a

b. In the Highlight dialog box, for Name, enter Cost less than or equals 500. For
is as

Background Color, select Green and for Text Color, select Black. Under Highlight
th ) h

Condition, for Column, select Cost and for Operator, select <=. For Expression,
us .com

enter 500.
e
ail

Click Apply.
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Reports 173


c. Notice that the rows that meet the condition are highlighted in Green color.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
11. Now, you want to control the number of rows to display on your Interactive Report page.

an
. n-tr
a. Select Actions > Format > Rows Per Page > 5.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10

b. Notice that Rows Per Page in your interactive report is now 1-5.
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

174 Practice: Managing and Customizing Interactive Reports


12. In your interactive report, you want to include a chart to display the average Cost for
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

each Project. Your interactive report should include both the Report and Chart views to
toggle.

a. Select Actions > Chart.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
b.
ide no
In the Chart dialog box, select/enter the following:
Gu a

• Chart Type: Bar


is as

• Label: Project
th ) h

• Value: Cost
us .com

• Function: Average
e
ail

Click Apply.
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Reports 175


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
c. The chart is created. Toggle between the Chart view and the Report view.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al

13. Create a Group By report to display each Project with the Total Budget.
diq

a. Click View Report.


Sa

b. Select Actions > Group By.

Copyright © 2023, Oracle and/or its affiliates.

176 Practice: Managing and Customizing Interactive Reports


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
c. In the Group By dialog box, enter/select the following:

ra
• Group By Column: Project

sfe
• Function: Sum

an
• Column: Budget

. n-tr
• Label: Total Budget ide no
• Format Mask: $5,324.10
Gu a

Make sure you enable Sum and click Apply.


is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Reports 177


d. The Group By report is created. You also see the sum of the budget. Notice that the
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

icon for View Group By is also added.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
e. Click the X to the right of Edit Group By to remove the filter.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

178 Practice: Managing and Customizing Interactive Reports


14. You want to display the Sum of Cost that is available with each Project and Assigned To.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

The results should be in a crosstab format. Create a Pivot report.

a. Click Actions > Pivot.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
b. In the Pivot dialog box, enter/select the following:
• Pivot Columns: Assigned To
ide no
Gu a

• Row Columns: Project


is as

• Functions: Sum
th ) h

• Column: Cost and Budget


us .com

• Label: Total Cost and Total Budget


e

• Sum: Yes
ail
gm

Click Apply.
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Reports 179


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a

c. The Pivot report is displayed, and a View Pivot icon is created next to the Actions
is as

button.
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

180 Practice: Managing and Customizing Interactive Reports


15. You want to save the report with all the customizations.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

a. Select Actions > Report > Save Report.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
b. Under Name, enter My Private Report and click Apply.
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al

16. A drop-down list automatically appears, with the report you just created being selected. You
diq

can view the default primary report. You want to reset the Primary Report back to the
Sa

default settings and remove any customizations that you have made so far.

a. Select Primary Report from the Reports drop-down list. The primary report is now
displayed. You can make any changes to this report, and it will not be reflected in the
My Private Report private report you just created.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Reports 181


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
b. To restore the primary report to its default settings, select Actions > Report > Reset.

sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@

c. In the Reset dialog box, click Apply.


6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

182 Practice: Managing and Customizing Interactive Reports


d. From the Reports drop-down list, select My Private Report.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
17. You want to download the customized report as a CSV.

an
. n-tr
a. Select Actions > Download.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Reports 183


b. In the Download dialog box, select CSV.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
c. The report is now downloaded as a CSV.

ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm

You now know how to manage and customize an interactive report as an end user. You may
now proceed to the next practice.
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

184 Practice: Managing and Customizing Interactive Reports


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
Grids
ide no
. n-tr
an
sfe
ra
bl e
lic
en
s e
to
Practice: Managing and
Customizing Interactive
Practice 1: Customize an Interactive Grid as a Developer
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

In this practice, you customize the Interactive Grid page you created in the Demo
Projects application as a Developer.

to
e
Downloads

s
en
• Did you miss out on trying the previous practices? Don’t worry! You can download the

lic
application from here and import it into your workspace. To run the app, follow the

bl e
steps described in Practice-01 and Practice-02.

ra
sfe
Tasks

an
. n-tr
Manage and Customize the Interactive Grid as a Developer
ide no
This practice uses the Demo Projects application. In this practice, you customize
Gu a

the Interactive Grid for end users. You create column groups, set the pagination type, and set
is as

the report downloadable formats that should be available to end users. You also enable end
th ) h

users to save the report as Public interactive grids and convert a read-only interactive grid to
us .com

an editable interactive grid.


e
ail

1. Navigate to App Builder and run the Demo Projects application.


gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

186 Practice: Managing and Customizing Interactive Grids


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as

2. In the navigation menu, click Project Tasks. You want to customize the display of this
th ) h

interactive grid for your end users. In the Developer Toolbar, click Edit Page 4.
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Grids 187


3. Add column group headers to the interactive grid:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• Project Breakdown: Project, Task_Name columns


• Schedule: Start_Date, End_Date columns
• Project Financing: Cost, Budget columns

a. In the Page Designer, under Components > Body, navigate to the Project
Tasks Interactive Grid region and right-click Column Groups. Select Create Column

to
Group.

s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail

b. In the Property Editor, for Heading, enter Project Breakdown.


gm
6 @
10
diq
sa
i(
Al
diq
Sa

c. Repeat steps a and b to create the Schedule and Project Financing column groups.

Copyright © 2023, Oracle and/or its affiliates.

188 Practice: Managing and Customizing Interactive Grids


d. Now that you have created column groups, you need to assign columns to them.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Expand Columns and select the Project and Task_Name columns.

e. In the Property Editor, under Layout, for Group, select Project Breakdown.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a

f. Then, select the StartDate and EndDate columns. In the Property Editor,
is as

under Layout, for Group, select Schedule.


th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

g. Finally, select the Cost and Budget columns. In the Property Editor, under Layout, for
Group, select Project Financing.

Then, click Save and Run Page.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Grids 189


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
h. The interactive grid now displays column groups.

an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq

4. Rearrange the columns in the interactive grid. You want to ensure the Project Breakdown,
Schedule, and Project Financing column groups display in order, followed by Status and
Sa

Assigned To.

a. Hover your mouse over the Project Financing column group header to display the drag
handle. Your cursor also changes when it comes into contact with the drag handle. Click
and hold the drag handle.

Copyright © 2023, Oracle and/or its affiliates.

190 Practice: Managing and Customizing Interactive Grids


b. Then, drag the column group to the Status column location. The heading shifts out of
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

place in the row. The Project Financing column group should be followed by the Status
column. Release the mouse. The Project Financing column group drops into place.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Grids 191


5. Click Page n in the runtime developer toolbar. You want to make the ID column as
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

the Primary Key. This will help you make the interactive grid editable.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
6. You want to ensure that end users are able to save Public interactive grids. You also want
ide no
to exclude HTML from the download formats available to end users.
Gu a

a. Under Rendering, select the Project Tasks interactive grid region.


is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

192 Practice: Managing and Customizing Interactive Grids


b. In the Property Editor, select Attributes and then navigate to Enable Users To.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Click Save Public Report to enable the feature. Under Download, deselect
the HTML check box.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @

7. Convert this read-only interactive grid into an editable interactive grid. Then, reset the
10

pagination as Page type, displaying the total row count.


diq
sa

a. Under Rendering, select the Project Tasks interactive grid region.


i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Grids 193


b. In the Property Editor, navigate to Attributes and then navigate to Edit. Click Enabled
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to turn on the feature. Also, under Pagination, for Type, select Page.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

194 Practice: Managing and Customizing Interactive Grids


8. Delete the column groups in the interactive grid. Under Rendering > Project Tasks
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Interactive Grid > Column Groups, select Schedule, Project Breakdown, and Project
Financing, right-click and select Delete.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

9. Assume you want to display the ID column and exclude the ID column from DML
e
ail

operations. Under Page Rendering > Project Tasks interactive grid, expand Columns and
gm

select ID.
6 @

Navigate to Identification and set Type to Display Only. Then, navigate to Source and
10

click Query Only to enable it. Click Save and Run Page.
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Grids 195


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
You now know how to manage and customize the interactive grid as a developer. You

ra
may now proceed to the next practice.

sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

196 Practice: Managing and Customizing Interactive Grids


Practice 2: Customize an Interactive Grid as an End User
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

In this practice, you customize the Interactive Grid page you created in the Demo
Projects application as an End User.

to
se
Tasks

en
lic
Customize an Interactive Grid as an End User

bl e
ra
In this practice, you use and customize the display of your interactive grid. You also edit an

sfe
editable interactive grid.

an
1. Notice that the interactive grid is now editable. You see the Edit, Save, and Add Row

. n-tr
buttons. Also, the pagination type that you have set is displayed. Perform a non-case-
ide no
sensitive search for server on the entire interactive grid.
Gu a

To do this, enter server in the search bar text area and click Go.
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Grids 197


2. Remove the filter by clicking the X icon.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Now, in the search bar, click the magnifying glass and select the Task Name column.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a

3. Enter server in the text area and click Go. Notice that the search is now restricted
is as

to the Task Name column.


th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

198 Practice: Managing and Customizing Interactive Grids


4. Remove the filter by clicking the X icon. You want to update the Cost for the Project with ID
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

1. Click the field and replace the existing value with 500.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
5. The changes are not saved yet. Click the Save button. The changes are now saved.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Grids 199


6. You want to update another row. This time, click the Row Actions menu icon at the edge of
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

the row for the project with ID 2 and select Single Row View.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h

7. You are now in the single row view of the project with ID 2. Replace the existing value for
us .com

Budget with 9000 and click Save. Then, click Report View.
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

The row now displays 9000 for Budget.

Copyright © 2023, Oracle and/or its affiliates.

200 Practice: Managing and Customizing Interactive Grids


8. You want to create a control break on the Project column. Click Actions > Format > Control
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Break.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
9. In the Control Break dialog box, for Column, enter Project and click Save.
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Grids 201


10. The control break is now applied. You want to highlight rows that meet a condition. Select
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Actions > Format > Highlight.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
11. In the Highlight dialog box, enter/select the following:
Gu a

• Name: Project Costing greater than 800


is as

• Background Color: Yellow


th ) h

• Text Color: Red


us .com

• Column: Cost
e
ail

• Operator: greater than or equals


gm

• Value: 800
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

202 Practice: Managing and Customizing Interactive Grids


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10
6@
gm

Practice: Managing and Customizing Interactive Grids


ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an

12. Notice the rows with a cost greater than 800 are highlighted.
sfe
ra
bl e
lic
en
s e
to

203
13. You want to save the changes made to the interactive grid. Select Actions > Report > Save
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

As.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
14. In the Report – Save As dialog box, for Type, select Private. Under Name, enter My Private
Gu a

Report. Click Save.


is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

204 Practice: Managing and Customizing Interactive Grids


15. Notice that the Primary interactive grid and the interactive grid you saved are now available
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

in the Reports drop-down list.

You want to return to the Primary interactive grid. Click Primary Report in the Reports
drop-down list.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h

16. You want to make few more customizations and save the interactive grid as another Private
us .com

report. You do not want the Start Date, End Date, and Assigned To columns to be
displayed in the report. Click the Start Date column header and then click Hide.
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Similarly, perform the same steps for the End Date and Assigned To columns.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Grids 205


17. You want to add a chart to the interactive grid. Select Actions > Chart.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
18. In the Chart dialog box, select:

. n-tr
• Type: Bar
• Label: Project ide no
• Value: Cost
Gu a
is as

• Aggregation: Sum
th ) h
us .com

Click Save.
e
ail
gm
@
6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

206 Practice: Managing and Customizing Interactive Grids


19. The chart is displayed. You want to save the customization made to the interactive grid.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Select Actions > Report > Save As.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
20. In the Report – Save As dialog box, for Type, select Private. Under Name, enter My
Custom Report. Then, click Save. ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Grids 207


21. The report is now saved under Private in the Reports drop-down list. Click the Grid icon.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
22. You want to download the report. Select Actions > Download.

an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

208 Practice: Managing and Customizing Interactive Grids


23. Note that the HTML download option is no longer available. Select Excel and
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

click Download.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as

24. The report is now downloaded as an Excel file.


th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

You now know how to manage and customize an interactive report as an end user. You may
now proceed to the next practice.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Grids 209


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

210
Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Managing and Customizing Interactive Grids


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr
an
sfe
ra
bl e
lic
Practice: Creating

en
s e
to
Application Page Controls
Practice 1: Add Items and Buttons to a Page
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

In this practice, you create new page items and buttons on the Shopping Cart and Add to Cart
pages created in Practice 2 of the Developing Reports workshop.

to
Customers will be able to:

s e
• Review items in the shopping cart

en
• Edit the quantity of the items

lic
• Remove an item

bl e
• Clear the shopping cart

ra
sfe
• Proceed to checkout

an
. n-tr
Downloads
• Did you miss out on trying the previous practices? Don’t worry! You can download the
ide no
application from here and import it into your workspace. To run the app, follow the
Gu a

steps described in the Get Started with Oracle APEX and Using SQL
is as

Workshop workshops.
th ) h
us .com

Tasks
e
ail
gm

Add Items and Buttons to a Page


@

1. Navigate to the App Builder. Then click Online Shopping Application.


6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

212 Practice: Creating Application Page Controls


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

2.
Sa
diq
Al
i(
sa
diq
10

Practice: Creating Application Page Controls


6@
gm
ail
us .com
e Under Page Icons, select Shopping Cart.
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

213
3. Drag a Static Content region and drop it to the right of the Shopping Cart region to create
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

a second region of content.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
4. In the Property Editor, for Title, enter Order Information.
ide no
5. Navigate to the Order Information (left pane) region.
Gu a

6. Right-click the Order Information region and select Create Page Item.
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

214 Practice: Creating Application Page Controls


7. In the Property Editor, enter/select the following:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• Name: P16_CUSTOMER_EMAIL
• Type: Text Field
• Label: Email Address
• Value Required: Off

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@

8. Create four items as follows:


6
10
diq

Table 1: Create Application Page Controls | Practice 1: Add Items and Buttons to a Page
sa

Value
i(

Name Type Label Template


Required
Al
diq

Optional -
P16_CUSTOMER_FULLNAME Text Field Full Name Off
Sa

Floating

P16_ORDER_ID Hidden

P16_CUSTOMER_ID Hidden

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating Application Page Controls 215


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Optional -
P16_STORE Select List Store Off
Floating

For the P16_STORE item, in the list of values section, configure the type as follows:
• Type: Select SQL Query
• SQL Query: Enter the following SQL Query:

to
select STORES.STORE_NAME as STORE_NAME,

s e
STORES.STORE_ID as STORE_ID

en
from STORES

lic
bl e
• Set Display Extra Values to Off

ra
• Null Display Value: Enter - Select a Store -

sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

216 Practice: Creating Application Page Controls


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
9. Navigate to the Order Information (left pane) region.
ide no
10. Right-click the Order Information region and select Create Button.
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating Application Page Controls 217


11. Create two buttons as follows:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Table 2: Create Application Page Controls | Practice 1: Add Items and Buttons to a Page

Button Button Button


Label Hot Icon
Name Position Template

to
Proceed to
Proceed Create Text On

e
Checkout

s
en
lic
Clear Shopping fa-cart-
Clear Change Text with Icon Off
Cart empty

bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

218 Practice: Creating Application Page Controls


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

Under Server-side Condition:


e
ail

Table 3: Create Application Page Controls | Practice 1: Add Items and Buttons to a Page
gm
@

Button Name Type Item


6
10

Proceed Item is NOT NULL SHOPPING_CART_ITEMS


diq
sa

Clear Item is NOT NULL SHOPPING_CART_ITEMS


i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating Application Page Controls 219


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
Add Items and Buttons

an
. n-tr
In this task, you will create four page items:
• PRODUCT_ID: To get the product ID ide no

Gu a
ACTION: To identify the action (Add/Edit/Delete) made for the customer
is as

• QUANTITY: To permit customers to select the number of items to add or edit in the
th ) h

shopping cart
us .com

• SHOPPING_CART_ITEMS: To get the total number of items in the shopping cart after
an action is made
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

220 Practice: Creating Application Page Controls


1. Navigate to Page Finder and click File. In the Page Finder pop-up, select Page 17.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h

2. Drag a Static Content region and drop it into the Dialog Footer.
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating Application Page Controls 221


3. In the Property Editor, enter/select the following:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• Title: Buttons Bar


• Template: Buttons Container

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail

4. In the Rendering tree (left pane), navigate to the Buttons Bar region.
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

222 Practice: Creating Application Page Controls


5. Right-click the Buttons Bar region and select Create Page Item.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

6. Create four items in the Property Editor:


e

Table 4: Create Application Page Controls | Practice 1: Add Items and Buttons to a Page
ail
gm

Name Type Label Template


6 @

P17_ACTION Hidden
10
diq

P17_PRODUCT_ID Hidden
sa
i(

P17_SHOPPING_CART_ITEMS Hidden
Al
diq

P17_QUANTITY Select List Quantity Required


Sa

For the P17_QUANTITY item, do the following:


• Under the List of Values section:

a) For Type, select Static Values.

b) For Static Values , click Display1, Display2 and enter the following:

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating Application Page Controls 223


Table 5: Create Application Page Controls | Practice 1: Add Items and Buttons
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to a Page

Display Value Return Value

1 1

to
2 2

s e
en
3 3

lic
4 4

bl e
ra
5 5

sfe
an
• Click OK.

. n-tr
• Set Display Extra Values to Off.
ide no
• Set Display Null Value to Off.
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

7. Navigate to the Buttons Bar region (left side).

Copyright © 2023, Oracle and/or its affiliates.

224 Practice: Creating Application Page Controls


8. Right-click the region and select Create Button.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm

9. Create three buttons as follows:


6 @

Table 6: Create Application Page Controls | Practice 1: Add Items and Buttons to a Page
10
diq

Button
Name Label Button Position Hot
sa

Template
i(
Al

Add Add to Cart Next Text On


diq

Update
Sa

Edit Create Text On


Quantity

Remove from
Delete Edit Text Off
Cart

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating Application Page Controls 225


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq

10. For the Delete button, apply the following changes:


Sa

• Under Appearance, click Template Options:


 Type: Danger
 Style: Display as Link
 Spacing Right: Large
• Click OK.

Copyright © 2023, Oracle and/or its affiliates.

226 Practice: Creating Application Page Controls


• Click Save.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

You now know how to create page items and page buttons. You may now proceed to the
e
ail

next practice.
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating Application Page Controls 227


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

228
Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Creating Application Page Controls


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr
an
sfe
ra
and Validations

bl e
application using

lic
en
s e
to
Computations, Processes
Practice: Enhancing your
Practice 1: Add Branches, Validations, and Processes to the
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Shopping Cart Page

Overview

This Hands-on Lab is a collection of six tasks. After completing this lab, your application will

to
enable customers to:

e
• Review the items in the shopping cart

s
en
• Edit the quantity of the items

lic
• Remove an item

bl e
• Clear the shopping cart

ra
• Proceed to checkout

sfe
an
In this lab, you will:

. n-tr
• Create Validations, Processes, and Branches to manage the Shopping Cart
Downloads ide no
Did you miss out on trying the previous labs? Don’t worry! You can download the
Gu a

is as

application from here and import it into your workspace. To run the app, please run the
steps described in Get Started with Oracle APEX and Using SQL Workshop workshops.
th ) h
us .com

Tasks
e
ail

Create Validations on the Page


gm

1. Navigate to the App Builder. Then, click Online Shopping Application.


6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

230 Practice: Enhancing your application using Computations, Processes and Validations
2. Now, you select Shopping Cart under Page Icons.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
3. In the Rendering tree (left pane), click the Processing tab.

sfe
an
4. Over Validating, right-click Create Validation.

. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Enhancing your application using Computations, Processes and Validations 231
5. Create three validations for the following items: Name, Email, and Store
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

Table 1: Enhance your application using Computations, Processes, and Validations | Lab 1:
e
ail

Add Branches, Validations, and Processes to the Shopping Cart Page


gm
@

Name Type (under Validation) Item


6
10

a.Validate Name Item is NOT NULL P16_CUSTOMER_FULLNAME


diq
sa

b.Validate Email Item is NOT NULL P16_CUSTOMER_EMAIL


i(
Al

c.Validate Store Item is NOT NULL P16_STORE


diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

232 Practice: Enhancing your application using Computations, Processes and Validations
Under Error:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Table 2: Enhance your application using Computations, Processes, and Validations | Lab 1:
Add Branches, Validations, and Processes to the Shopping Cart Page

Error Message Display Location Associated Item

to
Inline with Field and in
Please enter your name P16_CUSTOMER_FULLNAME

e
Notification

s
en
Please enter your email Inline with Field and in

lic
P16_CUSTOMER_EMAIL
address Notification

bl e
ra
Inline with Field and in

sfe
Please select a store P16_STORE
Notification

an
. n-tr
Because these validations only apply when the user proceeds to checkout, let's create that
condition. Under Server-side Conditions, set the following:
ide no
Gu a

Table 3: Enhance your application using Computations, Processes, and Validations | Lab 1: Add
is as

Branches, Validations, and Processes to the Shopping Cart Page


th ) h
us .com

Name When Button Pressed


e

Validate Name Proceed


ail
gm

Validate Email Proceed


6 @
10

Validate Store Proceed


diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Enhancing your application using Computations, Processes and Validations 233
Add a Process to Create the Order
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

1. On the Processing tab (left pane), right-click Processing and click Create Process.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a

2. In the Property Editor, enter the following:


is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

• For Name - enter Checkout.


• For Type -select Execute Code.
• For PL/SQL Code - enter the following PL/SQL code:

Copyright © 2023, Oracle and/or its affiliates.

234 Practice: Enhancing your application using Computations, Processes and Validations
BEGIN
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

MANAGE_ORDERS.create_order (
p_customer =>
:P16_CUSTOMER_FULLNAME,
p_customer_email =>
:P16_CUSTOMER_EMAIL,
p_store => :P16_STORE,
p_order_id =>

to
:P16_ORDER_ID,

e
p_customer_id =>

s
en
:P16_CUSTOMER_ID);
END;

lic
bl e
• For Success Message, enter Order successfully created: &P16_ORDER_ID.

ra
sfe
• Under Server-side Condition, for When Button Pressed, select Proceed.

an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @

Add Process to Clear the Shopping Cart


10
diq

1. On the Processing tab (left pane), right-click Processing and click Create Process.
sa
i(

2. Create a second process to clear the shopping cart. In the Property Editor and enter the
Al

following:
diq

• For Name - enter Clear Shopping Cart.


Sa

• For Type - select Execute Code.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Enhancing your application using Computations, Processes and Validations 235
• For PL/SQL Code - enter the following PL/SQL code:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

BEGIN
manage_orders.clear_cart;
END;

• Under Server-side Condition, for When Button Pressed, select Clear.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

236 Practice: Enhancing your application using Computations, Processes and Validations
Add Branches to the Page
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

1. On the Processing tab (left pane), right-click After Processing and click Create Branch.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
2. In the Property Editor, enter the following: ide no
• For Name - enter Go to Orders.
Gu a

• Navigate to Target attribute and click No Link Defined.


is as
th ) h

 For Type - select Page in this application.


For Page - enter 16.
us .com


 For Set Items - enter:
e
ail

Table 4: Enhance your application using Computations, Processes, and


gm

Validations | Lab 1: Add Branches, Validations, and Processes to the Shopping Cart
@

Page
6
10

Name Value
diq
sa

P16_ORDER &P16_ORDER_ID.
i(
Al

 For Clear Cache - enter 16.


diq

 Click OK.
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Enhancing your application using Computations, Processes and Validations 237
• Under Server-side Condition, for When Button Pressed, select Proceed.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a

3. Create a second branch when the user clears the shopping cart. Right-click After
is as

Processing and click Create Branch.


th ) h

4. In the Property Editor, enter the following:


us .com

• For Name - enter Go to Products.


e
ail

• Navigate to the Target attribute and click No Link Defined.


gm

 For Type - select Page in this application.


@

 For Page - enter 1.


6

For Clear Cache - enter 1.


10


diq

 Click OK.
• Under Server-side condition, for When Button Pressed, select Clear.
sa
i(
Al

You now know how to add validations, processes, and branches to your APEX page. You may
diq

now proceed to the next practice.


Sa

Copyright © 2023, Oracle and/or its affiliates.

238 Practice: Enhancing your application using Computations, Processes and Validations
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr
an
sfe
ra
bl e
Dynamic Actions

lic
en
s e
to
Practice: Creating and using
Practice 1: Add Dynamic Actions, Computations, and
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Processes

Overview

This practice is a collection of nine tasks. After completing this lab, your application will enable

to
customers to:

e
• Create dynamic actions to manage the Shopping Cart

s
en
• Review the product details

lic
• Add, edit, or remove the product from the shopping cart

bl e
• Read the customer reviews

ra
sfe
an
In this lab, you will:

. n-tr
• Create dynamic actions for the Shopping Carts Page
• ide no
Add Computations and Page Process to the Add to Cart page
Gu a
is as

Downloads
th ) h

• Did you miss out on trying the previous labs? Don’t worry! You can download the
us .com

application from here and import it into your workspace. To run the app, please run the
steps described in Get Started with Oracle APEX, Using SQL Workshop, and Enhancing
e
ail

your application using Computations, Processes, and Validations workshops.


gm
6 @

Tasks
10
diq

Add Dynamic Actions


sa
i(

In this task, you will create dynamic actions to:


Al

• Update the badge and icon shown in the navigation bar after the customer has
diq

added/edited/removed a product from the shopping cart


Sa

• Refresh the shopping cart region

Copyright © 2023, Oracle and/or its affiliates.

240 Practice: Creating and using Dynamic Actions


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

1.

Sa
diq
Al
i(
sa
diq
10
6

Practice: Creating and using Dynamic Actions


@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
Go to Shopping Cart page (Page No 16) in the page designer.

sfe
ra
bl e
lic
en
s e
to

241
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

2.

242
Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Navigate to the Dynamic Actions tab (left pane).

Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Creating and using Dynamic Actions


3. Right-click Dialog Closed and select Create Dynamic Action.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
4. In the Property Editor, enter the following:

an
• Under Identification section:

. n-tr
 For Name - enter Update Shopping Cart Header.
ide no
• Under When section:
Gu a

 For Event - select Dialog Closed.


is as

For Selection Type - select Region.


th ) h


us .com

 For Region - select Shopping Cart.


• Under Client-side Condition:
e
ail

 For Type - select JavaScript expression.


gm

 For JavaScript Expression, enter the following:


@

parseInt(this.data.P17_SHOPPING_CART_ITEMS) > 0
6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating and using Dynamic Actions 243


5. Navigate to Refresh Action.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• Under Identification section:


• For Name - enter Update Badge & Icon
• For Action - select Execute JavaScript Code.
• Under Settings section:
 For Code - enter the following JavaScript Code:

to
// Update Badge Text

e
apex.jQuery(".js-shopping-cart-item .t-Button-

s
en
badge").text(this.data.P17_SHOPPING_CART_ITEMS);

lic
// Update Icon

bl e
apex.jQuery(".js-shopping-cart-item .t-Icon").removeClass('fa-

ra
cart-empty').addClass('fa-cart-full');

sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

244 Practice: Creating and using Dynamic Actions


6. Create a second action. In the Dynamic Actions tab (left pane), navigate to True under the
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Update Shopping Cart Header Dynamic Action, right-click True, and select Create
TRUE Action

to
se
en
lic
bl e
ra
sfe
an
. n-tr
7. In the Property Editor, enter the following: ide no
• Under Identification section:
Gu a
is as

• For Name - enter Refresh Shopping Cart region


th ) h

• For Action - select Refresh.


us .com

• Under Affected Elements section:


• For Selection Type - select Region.
e
ail

• For Region - select Shopping Cart.


gm
@

8. Create an opposite action. In the Dynamic Actions tab (left pane), navigate to the Execute
6

JavaScript Code action.


10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating and using Dynamic Actions 245


9. Right-click Execute JavaScript Code and select Create Opposite Action.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
10. Navigate to the Execute JavaScript Code action under the False heading.
• Under Identification section:
ide no
Gu a

 For Action - select Execute JavaScript Code.


is as

• Under Settings section:


th ) h

 For Code - enter the following JavaScript Code:


us .com

// Update Badge Text


apex.jQuery(".js-shopping-cart-item .t-Button-badge").text('');
e
ail
gm

// Update Icon
@

apex.jQuery(".js-shopping-cart-item .t-Icon").removeClass('fa-
cart-full').addClass('fa-cart-empty');
6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

246 Practice: Creating and using Dynamic Actions


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
11. Create a second action. In the Dynamic Actions tab (left pane), navigate to False under the

sfe
Update Shopping Cart Header dynamic action.

an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq

12. In the Property Editor, enter the following:


sa

• Under Identification section:


i(

• For Name - enter Refresh Shopping Cart region


Al

• For Action - select Refresh.


diq

• Under Affected Elements section:


Sa

• For Selection Type - select Region.


• For Region - select Shopping Cart.

13. Click Save.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating and using Dynamic Actions 247


Format Products Image Size
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

1. In the Rendering tree (left pane), navigate to Page 16: Shopping Cart.

2. In the Property Editor (right pane), do the following:


• Under CSS section:
 For Inline - enter the following:

to
img {

s e
width: 150px;

en
height: 150px;

lic
}

bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm

3. Click Save.
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

248 Practice: Creating and using Dynamic Actions


Add Computation to Calculate the Number of Items for a Product
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

1. Navigate to Page Finder and click File symbol. Then in the popup Page Finder, select
page 17.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
2. In the Rendering tree (left pane), expand the Pre-Rendering.
ide no
Gu a

3. Right-click Before Regions and select Create Computation.


is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al

4. In the Property Editor, enter the following:


diq
Sa

• Under Identification section:


 For Item Name - select P17_QUANTITY.
• Under Computation:
 For Type - select Function Body.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating and using Dynamic Actions 249


 For PL/SQL Function Body - enter the following PL/SQL Code:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

RETURN manage_orders.product_exists(p_product =>


:P17_PRODUCT_ID);

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as

Create a Process to Add Products to the Shopping Cart


th ) h
us .com

In this Task, you call the manage_orders.add_product procedure that will add a product
temporarily to the APEX collection.
e
ail
gm

1. In the Rendering tree (left pane), navigate to the Processing tab.


6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

250 Practice: Creating and using Dynamic Actions


2. Right-click Processing and select Create Process.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
3. In the Property Editor, enter the following:

sfe
• For Name - enter Add product.

an
• For Type - select Execute Code.

. n-tr
• For PL/SQL Code - enter the following code:
ide no
BEGIN
Gu a

IF manage_orders.product_exists(p_product =>
is as

:P17_PRODUCT_ID) = 0 THEN
th ) h

manage_orders.add_product (p_product =>


:P17_PRODUCT_ID,
us .com

p_quantity => :P17_QUANTITY);


END IF;
e
ail

:P17_ACTION := 'ADD';
gm

END;
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating and using Dynamic Actions 251


• Under the Server-side Condition section:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

 For When Button Pressed - select Add.

4. Click Save.

Create a Process to Edit Products in the Shopping Cart

to
In this Task, you call the manage_orders.remove_product and manage_orders.add_product

e
procedures to remove a product from the shopping cart and add it again with the updated

s
en
quantity.

lic
1. In the Processing tab, right-click Processing and select Create Process.

bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

2. In the Property Editor, enter the following:


e
ail

• For Name - enter Edit product.


gm

• For Type - select Execute Code.


6@

• For PL/SQL Code - enter the following PL/SQL code:


10

BEGIN
diq

IF manage_orders.product_exists(p_product =>
sa

:P17_PRODUCT_ID) > 0 THEN


manage_orders.remove_product(p_product =>
i(

:P17_PRODUCT_ID);
Al

manage_orders.add_product (p_product =>


diq

:P17_PRODUCT_ID,
Sa

p_quantity => :P17_QUANTITY);


END IF;
:P17_ACTION := 'EDIT';
END;

Copyright © 2023, Oracle and/or its affiliates.

252 Practice: Creating and using Dynamic Actions


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.


Click Save.
Sa
diq
Al
i(
sa
diq
10
6

Practice: Creating and using Dynamic Actions


@
gm
ail
us .com
Under Server-side Condition section:

e
th ) h
For When Button Pressed, select Edit.

is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

253
Create a Process to Delete Products from the Shopping Cart
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

In this Task, you call the manage_orders.remove_product to remove a product from the
shopping cart.

1. In the Processing tab, right click Processing and select Create Process.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
In the Property Editor, enter the following:
• For Name - enter Delete product. ide no
Gu a

• For Type - select Execute Code.


is as

• For PL/SQL Code - enter the following PL/SQL code:


th ) h

BEGIN
us .com

IF manage_orders.product_exists(p_product =>
:P17_PRODUCT_ID) > 0 THEN
e

manage_orders.remove_product(p_product =>
ail

:P17_PRODUCT_ID);
gm

END IF;
@

:P17_ACTION := 'DELETE';
6

END;
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

254 Practice: Creating and using Dynamic Actions


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
• Under the Server-side Condition section: ide no
 For When Button Pressed, select Delete.
Gu a
is as

Click Save.
th ) h

Create a Process to Calculate the Shopping Cart Items


us .com

In this task, you call the manage_orders.get_quantity to get the total number of products in the
e
ail

shopping cart.
gm
@

1. In the Processing tab, right-click Processing and select Create Process.


6
10

2. In the Property Editor, enter the following:


diq

• For Name - enter Calculate Shopping Cart Items.


sa

• For Type - select Execute Code.


i(

• For PL/SQL Code - enter the following PL/SQL code:


Al

BEGIN
diq

:P17_SHOPPING_CART_ITEMS := manage_orders.get_quantity;
Sa

END;

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating and using Dynamic Actions 255


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
Click Save.

ra
sfe
Create a Process to Close the Modal Page

an
. n-tr
After the customer has taken an action (add/edit/delete) regarding the product, the modal page
will close and the shopping process continues. ide no
Gu a

1. In the Processing tab, right-click Processing and click Create Process.


is as
th ) h

2. In the Property Editor, enter the following:


us .com

• Under the Identification section:


 For Name - enter Close Dialog.
e
ail

 For Type - select Close Dialog.


gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

256 Practice: Creating and using Dynamic Actions


.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• Under Settings section:


 For Items to Return - enter
P17_SHOPPING_CART_ITEMS,P17_PRODUCT_ID,P17_ACTION,P17_QUANTITY.
Click Save.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h

Enhance the Modal Page


us .com

1. Navigate to the Rendering tab (left pane).


e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

2. In the rendering tree, select the root node in the component tree Page 17: Add to
Cart.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating and using Dynamic Actions 257


3. In the Property Editor, make the following changes:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• Under the Identification section: For Title, enter Manage Your Cart.
• Under the Dialog section:
 For Width, enter 600.
 For Height, enter 600.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h

4. Click Save.
us .com

You now know how to customize and enhance the APEX page. You may now proceed to the
e
ail

next practice.
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

258 Practice: Creating and using Dynamic Actions


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
Filters
ide no
. n-tr
an
sfe
ra
bl e
lic
en
s e
to
Practice: Managing Cards,
Faceted Search, and Smart
Practice 1: Improve Smart Filters Page
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

In this lab, you will gain an insight into the abilities of Smart Filters, and learn how to add New
Filters and Edit existing Filters

to
Downloads

s e
• Did you miss out on trying the previous labs? Don’t worry! You can download the

en
application from here and import it into your workspace. To run the app, please run

lic
the steps described in Get Started with Oracle APEX and Using SQL

bl e
Workshop workshops.

ra
sfe
Task

an
. n-tr
Enhance Smart Filters
ide no
In this Lab, you are going to customize the Smart Filters page in the Demo
Gu a
is as

Projects application. The Project Tasks Search page utilizes Smart Filters to display the
th ) h

records.
us .com

1. Navigate to the App Builder. Then, click the Demo Projects application.
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

260 Practice: Managing Cards, Faceted Search, and Smart Filters


2. Now, you run the application using the Run Application icon.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
3. Navigate to the Project Tasks Search page and click Page 8 in the Developer

sfe
toolbar. Note that your page number might be different.

an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq

4. Now, Update P8_PROJECT, Change type to Radio Group and enable the Client-Side
sa

Filtering attribute.
i(

In the Rendering tab, select the P8_PROJECT filter (if not already selected). In the Property
Al

Editor, under the Identification change type to Radio Group, then find List Entries and
diq

enable Client-Side Filtering. Enabling this option renders a search field above the list
Sa

entries.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Cards, Faceted Search, and Smart Filters 261


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

5. Click Save and Run Page in the upper-right corner. If prompted, enter your workspace
e
ail

username and password and click Sign In. The revised page appears.
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

262 Practice: Managing Cards, Faceted Search, and Smart Filters


Add New Smart Filter
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Add new filters in Page Designer by right-clicking filter and selecting Create Filter from the
context menu.

Filters map to specific database column. When creating a new filter, you can create the following
types: Checkbox Group, Input Field, Radio Group, and Range.

to
1. View the smart filters page in Page Designer. In the Rendering tab, right-click Filters and

se
select Create Filter.

en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@

2. Select the new filter and edit the following filter attributes in the Property Editor:
6
10

• Under Identification:
diq

• For Name, enter P8_TASK_NAME.


sa

• For Type, select Checkbox Group.


i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Cards, Faceted Search, and Smart Filters 263


• Under List of Values:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• For Type, select Distinct Values.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a

3. Click Save and Run Page in the upper-right corner. If prompted, enter your
is as
th ) h

workspace username and password and click Sign In. The revised page appears.
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

264 Practice: Managing Cards, Faceted Search, and Smart Filters


Practice 2: Improve and Customize the Faceted Search and
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Cards Regions

Overview

In this lab, you will learn how to improve the Products page by adding new facets and

to
customizing the cards.

se
Please note that customer can quickly identify the products that already have been added to the

en
shopping cart.

lic
bl e
In this practice, you will:

ra
• Improve both Faceted Search and Cards region

sfe
• Add Dynamic Actions to the page

an
. n-tr
Downloads
• Did you miss out on trying the previous labs? Don’t worry! You can download the
ide no
application from here and import it into your workspace. To run the app, please run
Gu a

the steps described in Get Started with Oracle APEX and Using SQL
is as

Workshop workshops.
th ) h

Task: Navigate to Products Page.


us .com

1. From the runtime application, navigate to the Products page in Page Designer.
e
ail

Given that you run this app from the APEX App Builder, you will find the Developer
gm

Toolbar at the bottom of the screen. {Note: End users who log directly into the app
@

will not see this toolbar.}


6

In the Developer Toolbar click Page 19.


10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Cards, Faceted Search, and Smart Filters 265


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
Alternatively, you can also navigate back to the APEX App Builder tab in your browser

an
manually by selecting the appropriate browser tab or window.

. n-tr
Once in the App Builder, click 19 - Products.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al

You should now be in Page Designer with Page 19: Products loaded.
diq
Sa

Reorder Facets

Unit price is not a common search criteria, so you want to put this facet at the bottom.

1. In the Rendering tree (left pane), under Search, within Facets, click and hold
P19_UNIT_PRICE and drag it down until it is under P19_CLOTHING_ID, then release the
mouse cursor.

Copyright © 2023, Oracle and/or its affiliates.

266 Practice: Managing Cards, Faceted Search, and Smart Filters


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
Enhance the Faceted Search
ide no
1. In the Rendering tree (left pane), navigate to Search.
Gu a
is as

2. In the Property Editor (right pane), click Attributes and do the following:
th ) h

• For Total Row Count Label - enter Total Products.


us .com

• For Show Charts - select No.


e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Cards, Faceted Search, and Smart Filters 267


Enhance the Cards Region
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

1. In the Rendering tree (left pane), navigate to Search Results and in the Property Editor
(right pane), do the following:
• For SQL Query - enter the following SQL code:
SELECT "PRODUCT_ID",
"PRODUCT_NAME",

to
"UNIT_PRICE",

e
"PRODUCT_DETAILS",

s
en
"PRODUCT_IMAGE",

lic
"IMAGE_MIME_TYPE",

bl e
"IMAGE_FILENAME",
"IMAGE_CHARSET",

ra
"IMAGE_LAST_UPDATED",

sfe
"COLOR_ID",

an
(

. n-tr
SELECT l1."COLOR"
FROM "COLOR_LOOKUP" l1ide no
WHERE l1."COLOR_ID" = m."COLOR_ID") "COLOR_ID_L$1",
Gu a

"DEPARTMENT_ID",
is as

(
th ) h

SELECT l2."DEPARTMENT"
us .com

FROM "DEPARTMENT_LOOKUP" l2
WHERE l2."DEPARTMENT_ID" = m."DEPARTMENT_ID")
"DEPARTMENT_ID_L$2",
e
ail

"CLOTHING_ID",
gm

(
@

SELECT l3."CLOTHING"
6

FROM "CLOTHING_LOOKUP" l3
10

WHERE l3."CLOTHING_ID" = m."CLOTHING_ID")


diq

"CLOTHING_ID_L$3",
b.brand
sa

FROM "PRODUCTS" m,
i(
Al

json_table (m.product_details, '$' columns ( brand


varchar2(4000) path '$.brand') ) b
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

268 Practice: Managing Cards, Faceted Search, and Smart Filters


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
Under Appearance section:

sfe
• Click Template Options. For Style - select Style A.

an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq

• Click OK
sa
i(

2. Click Attributes and apply the following changes:


Al

• Click Attributes and apply the following changes:


diq

• For Layout - select Grid.


Sa

• For Grid Columns - select Auto.


• Under Title section:
• For Column - select PRODUCT_NAME.
• Under Subtitle section:
• Set Advanced Formatting to On.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Cards, Faceted Search, and Smart Filters 269


• For HTML Expression - enter the following:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

<small>&BRAND.</small><br />
<b class="u-success-text u-pullRight" id="message_&PRODUCT_ID.">
{if QUANTITY/} &QUANTITY. in cart {endif/}
</b>
<b>$&UNIT_PRICE.</b>

to
e
• Under Media section:

s
en
• For Source - select BLOB Column.

lic
• For BLOB Column - select PRODUCT_IMAGE.

bl e
• For Position - select First.

ra
• For Appearance - select Widescreen.

sfe
• For Sizing - select Fit.

an
• Under Card section:

. n-tr
• For Primary Key Column 1 - select PRODUCT_ID
ide no
• Click Save.
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

270 Practice: Managing Cards, Faceted Search, and Smart Filters


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
Create Actions

ra
sfe
Customers need a way to shop the products, so in this task you will add an action to allow

an
customers to learn more about the product.

. n-tr
1. Navigate to Search Results (left pane).
ide no
2. On Actions, right-click Create Action.
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Cards, Faceted Search, and Smart Filters 271


3. In the Property Editor (right pane), enter the following:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• For Type - select Full Card.


• For Target - click No Link Defined and do the following:
• For Page - enter 17.
• For Set Items, enter:
Table 1: Manage Cards, Faceted Search, and Smart Filters | Lab 2: Improve and Customize the

to
Faceted Search and Cards regions

s e
Name Value

en
lic
P17_PRODUCT_ID &PRODUCT_ID.

bl e
ra
• For Clear Cache, enter 18.

sfe
• Click OK.

an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(

Add Dynamic Actions


Al
diq

In this task, you will create two dynamic actions:


• To show a success message when a product is added/edited/removed from the
Sa

shopping cart
• To update the badge and icon shown in the navigation bar after the customer has
added/edited/removed a product from the shopping cart

Copyright © 2023, Oracle and/or its affiliates.

272 Practice: Managing Cards, Faceted Search, and Smart Filters


1. Navigate to Dynamic Actions tab (left pane).
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
2. Right-click Dialog Closed and select Create Dynamic Action.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq

3. In the Property Editor, enter the following:


Sa

• Under the Identification section:


• For Name - enter Show Success Message.
• Under When section:
• For Event - select Dialog Closed.
• For Selection Type - select Region.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Cards, Faceted Search, and Smart Filters 273


• For Region - select Search Results.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a

4. Navigate to Refresh Action.


is as
th ) h

• Under Identification section:


us .com

• For Action - select Execute JavaScript Code.


• Under Settings section:
e
ail

• For Code - enter the following JavaScript Code:


gm

var productAction = this.data.P17_ACTION,


@

productQuantity = this.data.P17_QUANTITY,
6

productCard$ = apex.jQuery("#message_" +
10

this.data.P17_PRODUCT_ID);
diq

if (productAction === 'ADD') {


sa

productCard$.text("Added " + productQuantity + " to cart!");


i(
Al

} else if (productAction === 'EDIT') {


productCard$.text("Updated quantity to " + productQuantity +
diq

"!");
Sa

} else if (productAction === 'DELETE') {


productCard$.text("Removed from cart!");
}

Copyright © 2023, Oracle and/or its affiliates.

274 Practice: Managing Cards, Faceted Search, and Smart Filters


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
5. Create a second dynamic action. Right-click Dialog Closed and select Create Dynamic
Action.

an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq

6. In the Property Editor, enter the following:


sa

• Under Identification section:


i(
Al

• For Name - enter Update Shopping Cart Header.


diq

• Under When section:


Sa

• For Event - select Dialog Closed.


• For Selection Type - select Region.
• For Region - select Search Results.
• Under Client-side Condition:
• For Type - select JavaScript expression.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Cards, Faceted Search, and Smart Filters 275


• For JavaScript Expression, enter the following:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

parseInt(this.data.P18_SHOPPING_CART_ITEMS) > 0

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
7. Navigate to the Refresh action.
ide no
• Navigate to the Refresh action.
Gu a

• For Action - select Execute JavaScript Code.


is as

• Under Settings section:


th ) h

• For Code - enter the following JavaScript Code:


us .com

// Update Badge Text


apex.jQuery(".js-shopping-cart-item .t-Button-
e
ail

badge").text(this.data.P17_SHOPPING_CART_ITEMS);
gm
@

// Update Icon
6

apex.jQuery(".js-shopping-cart-item .t-Icon").removeClass('fa-
10

cart-empty').addClass('fa-cart-full');
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

276 Practice: Managing Cards, Faceted Search, and Smart Filters


8. Create an opposite action. In the Dynamic Actions tab (left pane), navigate to the newly
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

dynamic action.

9. Right-click Execute JavaScript Code and select Create Opposite Action.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as

10. Navigate to the Execute JavaScript Code action.


th ) h

• Under the Identification section:


us .com

• For Action - select Execute JavaScript Code.


• Under the Settings section:
e
ail

• For Code - enter the following JavaScript Code:


gm

// Update Badge Text


@

apex.jQuery(".js-shopping-cart-item .t-Button-badge").text('');
6
10

// Update Icon
diq

apex.jQuery(".js-shopping-cart-item .t-Icon").removeClass('fa-
sa

cart-full').addClass('fa-cart-empty');
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Cards, Faceted Search, and Smart Filters 277


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
11. Click Save and Run Page.

an
. n-tr
Run the Products Page
ide no
1. After running products page, your page will look like the following image:
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al

You now know how to enhance faceted search and cards region. You may now proceed to the
diq

next lab.
Sa

Copyright © 2023, Oracle and/or its affiliates.

278 Practice: Managing Cards, Faceted Search, and Smart Filters


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a Forms
ide no
. n-tr
an
sfe
ra
bl e
lic
en
s e
to
Practice: Creating and Using
Practice 1: Create and Customize Forms
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

In this lab, you will learn how to create and customize a Form and then you will link the form to
an Interactive Report.

to
Downloads

s e
• Did you miss out on trying the previous labs? Don’t worry! You can download the

en
application from here and import it into your workspace. To run the app, please run

lic
the steps described in Get Started with Oracle APEX and Using SQL Workshop

bl e
workshops.

ra
sfe
Create a Product Details Form

an
. n-tr
1. Navigate to the App Builder. Then, click Online Shopping Application.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

280 Practice: Creating and Using Forms


2. Now, click Create Page.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
3.

an
For Create a Page: Select Page Type - select Component and then select Form.

. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

4. For Page Attributes, enter the following:


Under Page Definition:
• For Page Number, enter 21.
• For Page Name, enter Product Details.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating and Using Forms 281


• For Page Mode, select Modal Dialog.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Under Data Source


• For Table/View Name, Select PRODUCTS. Click Next.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm

5. Under Primary key, for Primary Key Column1 - Ensure the PRODUCT_ID is selected as the
@

primary key. Then click Create Page.


6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

282 Practice: Creating and Using Forms


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
Link a Report to a Form
ide no
1. Navigate to the App Builder. Then, click Online Shopping Application and run
Gu a

Application. From the runtime application, navigate to the Manage Products page in
is as

Page Designer.
th ) h
us .com

Given that you run this app from the APEX App Builder, you will find the Developer
Toolbar at the bottom of the screen. {Note: End users who log directly into the app
e
ail

will not see this toolbar.}


gm

In the Developer Toolbar, click Page 14.


6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating and Using Forms 283


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
2. In the Rendering tree (left pane), navigate to Products.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al

3. In the Property Editor (right pane), click Attributes and do the following:
diq

• Under Link:
Sa

• For Link Column - select Link to a Custom Target


• Click No Link Defined Button and do the following in the popup:
• For Page - enter 21.
• For Set Items, enter:

Copyright © 2023, Oracle and/or its affiliates.

284 Practice: Creating and Using Forms


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Name Value

P21_PRODUCT_ID #PRODUCT_ID#

• For Clear Cache, enter 21.


• Click OK.

to
Click Save.

se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

4. Click Save and then reload the Manage Products page in the runtime
e
ail

environment.
gm
@

5. Now, In the Manage Products page, click Pencil Icon on the first row. Verify the Product
6

Details model dialog page.


10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating and Using Forms 285


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

286
Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Creating and Using Forms


Enhance the Form
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

1. Navigate to Page 21 in the App Builder. Then, click P21_PRODUCT_NAME in the Rendering
Tree. Now, change the Identification Type to Text Field in the Property Editor.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
2. Items can readily be moved using drag-and-drop within Layout. If required, you can also
Gu a

drag new components such as regions, items, and buttons into the Layout pane from the
is as

Gallery, located directly below it.


th ) h
us .com

In Page Designer, with Page 21 loaded, within Layout (middle pane), click P21_UNIT_PRICE and
continue to hold the mouse cursor down. Drag the item up and to the right, until it is directly
e
ail

after P21_PRODUCT_NAME, and a dark yellow box is displayed. Release the mouse cursor to
gm

drop the item in the new location.


6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating and Using Forms 287


3. As an alternative to using drag-and-drop you can also reposition items using attributes in
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

the Property Editor.

In Page Designer, within Layout (or the Rendering tree in the left pane), select
P21_IMAGE_CHARSET. In the Property Editor (right pane), under Layout > Start New Row.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as

4. You now need to Focus on First item on Page. In Page Rendering (Left Pane), Select
th ) h

Page 21: Product Details. Then, In the Property Editor, Scroll down to Navigation and for
us .com

Cursor Focus, select First item on page. Then, click Save.


e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

288 Practice: Creating and Using Forms


5. Now that you have customized the Form. You can reload Manage Products page in the
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

runtime environment. Click Edit to view the Form Page.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a

You now know how to create and customize a Form and then link the form to an Interactive
is as

Report. You may now proceed to the next lab.


th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating and Using Forms 289


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

290
Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Creating and Using Forms


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr
an
Application

sfe
ra
bl e
lic
Navigation in your

en
s e
to
Practice: Implementing
Practice 1: Improve Application
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

In this lab, you will learn how to make some pages publicly accessible.

In this lab, you will:

to
• Set the following pages as public pages:

s e
• Products

en

lic
Shopping Cart

bl e
• Order Information
• Disable the Navigation Menu

ra
sfe
• Enhance the Navigation Bar

an
Downloads

. n-tr
• Did you miss out trying the previous labs? Don’t worry! You can download the
ide no
application from here and import it into your workspace. To run the app, please run
Gu a

the steps described in Get Started with Oracle APEX and Using SQL
is as

Workshop workshops.
th ) h
us .com

Set Products page as the Home Page

In this lesson, you will set the products page as the Home page and then you will remove
e
ail

the Home page under Navigation Menu.


gm
@

1. Navigate to the App Builder. Then, click Online Shopping Application.


6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

292 Practice: Implementing Navigation in your Application


2. Now, select Shared Components.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
3. Under User Interface, click User Interface Attributes.

sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Implementing Navigation in your Application 293


4. Now, under Attributes, select ≡ next to Home URL. Then, in the popup window, select 19
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

PRODUCTS and click Apply Changes.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

5. Because you have changed the Home Page to Products page, you now need to
e
ail

remove Home Page under Navigation Menu.


gm

Navigate to Shared Components.


6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

294 Practice: Implementing Navigation in your Application


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

6.
Sa
diq
Al
i(
sa
diq
10
6@
gm

Practice: Implementing Navigation in your Application


ail
us .com
e
th ) h
Under Navigation, Select Navigation Menu.

is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

295
7. Select Navigation Menu, then select Pencil Icon before Home.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm

8. In the List Entry page, Click the Delete button and then confirm delete by clicking OK.
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

296 Practice: Implementing Navigation in your Application


Set Pages to Public
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Your customers don't need to log in to the app to shop the products, so let's set the following
pages as public:
• Page 19: Products
• Page 15: Order Information
• Page 16: Shopping Cart

to
e
• Page 17: Add to Cart

s
en
Follow these steps for the four listed pages:

lic
bl e
1. From the runtime application, navigate to the Products page.

ra
In the Developer Toolbar click Edit Page 19.

sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Implementing Navigation in your Application 297


2. Within Page Designer, in the Rendering tree (left pane), navigate to Page 19: Products.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

In the Property Editor (right pane), apply the following change:


• Under Security section:
• For Authentication - select Page Is Public.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
3. Click Save.
Gu a
is as

4. Navigate to Page Finder and select Page 15 from Dialog Page. Repeat steps 2-4.
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

5. Repeat steps 2-4 for Page 16: Shopping Cart and Page 17: Add to Cart.

Copyright © 2023, Oracle and/or its affiliates.

298 Practice: Implementing Navigation in your Application


Remove the Navigation Menu
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Because the home page is the Products page and this is a public access page, we do not need
a navigation menu. In this task, you will turn off displaying the navigation menu.

1. Within Page Designer, click the Shared Components icon at the top-right corner.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
Alternatively, if you are in the App Builder, click Shared Components.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Implementing Navigation in your Application 299


2. Under User Interface, click User Interface Attributes.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
3. Click Navigation Menu.

. n-tr
4. Set Display Navigation to Off.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq

5. Click Apply Changes.


Sa

Enhance the Navigation Bar List

Add a new navigation bar entry to allow:


• Customers to go directly to the Shopping Cart
• Administrators to log in and access the administration page

Copyright © 2023, Oracle and/or its affiliates.

300 Practice: Implementing Navigation in your Application


1. Click the Shared Components icon at the top-right corner.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
2. Under Navigation, click Navigation Bar List.

bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm

3. Click Navigation Bar.


6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Implementing Navigation in your Application 301


4. Click Create Entry.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
5. In the List Entry page, enter the following and click Create List Entry.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@6
10
diq
sa
i(
Al
diq

• For Sequence - enter 1.


Sa

• For Image/Class – enter &SHOPPING_CART_ICON.


• For List Entry Label – enter Shopping Cart.
• For Page - select 16.
• For Clear cache - enter 16.

Copyright © 2023, Oracle and/or its affiliates.

302 Practice: Implementing Navigation in your Application


6. Scroll under User Defined Attributes and enter the following:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• For 1. Badge Value - enter &SHOPPING_CART_ITEMS.


• For 2. List Item CSS Classes - enter js-shopping-cart-item.

7. Click Create List Entry.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
8. Click the Pencil Icon before &APP_USER. ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Implementing Navigation in your Application 303


9. Under Authorization, for Authorization Scheme, select Administration Rights.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

10. Click Apply Changes.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
11. Click Create Entry and enter the following:
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al

• For Sequence - enter 5.


diq

• For Image/Class - enter fa-wrench.


Sa

• For List Entry Label - enter Administration.


• For Page - select 10000.

Copyright © 2023, Oracle and/or its affiliates.

304 Practice: Implementing Navigation in your Application


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
12. Click Create List Entry.

an
. n-tr
You now know how to set page as public and manage Navigation bar and Navigation menu. You
may now proceed to the next lab. ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Implementing Navigation in your Application 305


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

306
Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Implementing Navigation in your Application


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr
an
sfe
ra
Themes Styles

bl e
lic
en
s e
to
Practice: Using Themes and
Practice 1: Use Themes and Theme Styles
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

In this lab, you use the Theme Roller to save a new Theme Style. Then, you enable end users
to apply this style while running the application.

to
Downloads

s e
• Did you miss out trying the previous labs? Don’t worry! You can download the

en
application from here and import it into your workspace. To run the app, please run

lic
the steps described in Get Started with Oracle APEX and Using SQL

bl e
Workshop workshops.

ra
sfe
Use Themes and Theme Styles

an
. n-tr
In this hands-on lab, you use the Theme Roller to save a Theme Style. Then, you enable end
ide no
users to apply this style while running the application.
Gu a

1. Navigate to App Builder and then run the Online Shopping Application. In the
is as

Developer Toolbar, click Customize and then select Theme Roller.


th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

308 Practice: Using Themes and Themes Styles


2. The current Theme Style is Vita. Under Global Colors, click the color swatch to select new
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

colors. To edit a specific component, expand a group and select new colors or styling of the
component you wish to edit.

Modify the look by specifying colors of your choice and preview the changes. Once you are
done, click Save As.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

3. Under Theme, change the Select Theme to Redwood Light.


e
ail

4. For Theme Attributes, enter the following:


gm

Under Redwood Options:


@

• For Layout, select Floating.


6

Under Appearance:
10
diq

• For Header, select Dark.


• For Body Header, select Dark.
sa
i(

• For Body Background, select Dark.


Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Using Themes and Themes Styles 309


• Click Save As.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

5. In the Save As dialog, enter Redwood Light (Copy_1) for Style Name and click Save.
e
ail
gm
@6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

310 Practice: Using Themes and Themes Styles


6. Close the Theme Roller by clicking X. Click App <n> in the Developer Toolbar.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
7. In the application home page, click Shared Components. Under User Interface, click User

. n-tr
Interface Attributes.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Using Themes and Themes Styles 311


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
8. Under Attributes, click Enable End Users to Choose Theme Style. Make sure this
Gu a

attribute is set to On. Notice that the new Theme Style you saved is displayed under Theme
is as

Style list. Click Apply Changes.


th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

312 Practice: Using Themes and Themes Styles


9. Now, run the application. At the bottom of the page, click the Customize link.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
10. Using the Customize dialog box, users can specify their Theme Style while running the
application. Select the Theme Style that you saved in step 3 above and click Apply
ide no
Changes.
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Using Themes and Themes Styles 313


11. The Theme Style is applied, and you see a message that says Preferences changed for
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

user < username >.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
You now know how to use the Theme Roller to save a new Theme Style. You may
ide no
now proceed to the next lab.
Gu a
is as
th ) h
us .com
e
ail
gm
@
6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

314 Practice: Using Themes and Themes Styles


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr
an
sfe
ra
bl e
lic
en
Practice: Extending

s e
to
Application Capabilities
Practice 1: Manage Approvals Component
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

In this workshop, you will create an application that allows you to manage expenses using the
approvals component. To explain the concepts and terms associated with Approval
Management in APEX, we take the example of the Expense Tracker Application.

to
s e
To apply for an expense, an employee logs in to the application and submits an expense request

en
filling in the Type (Accommodation/Conference/Internet/ Miscellaneous Expenses) and

lic
Estimated Expenses. The task could be assigned to multiple potential owners, and then they

bl e
can perform possible actions (Request information/Delegate/Release/Change Priority).

ra
If the expense cost is more than 50000, then the Expense request, once approved by the

sfe
immediate manager, will go to the next manager and so on, depending on the Expense amount.

an
This is a typical use case for a multi-level approval.

. n-tr
Also, Deadlines and Expiration are set for a task. The potential owner will get an Email before 5
ide no
mins of task expiration. If the task is not approved or rejected before the expiry, then the task
Gu a

could be tagged as Expired.


is as
th ) h

In this lab, you will:


us .com

• Obtain a free development environment


• Learn how to create a SQL Script
e
ail

• Learn how to create a Task definition


gm

• Learn how to create a Page to submit Expense


@

• Learn how to create a Unified Task List


6
10

• Learn how to create Users


diq

• Learn how to create an Email Template


sa

• Learn how to request Information/ Delegate/ Release


i(

• Learn how to set deadlines and expiration


Al
diq
Sa

Create the Application

In this lab, you create a new application named Expense Tracker.

1. If you have not already logged in to your Oracle APEX workspace, sign in using the
workspace name, email, and password you signed up with.

Copyright © 2023, Oracle and/or its affiliates.

316 Practice: Extending Application Capabilities


2. At the top left of your workspace, click App Builder.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
3. On the App Builder page, click Create.

ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

4. Click New Application.


e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

5. In the Create an Application Wizard, set Name to Expense Tracker.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 317


6. Click Create Application to create your app and go to the application home page.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as

Create a SQL Script


th ) h
us .com

In this lab, you create database objects using SQL Script.


e
ail

7. At the top of the application home page, click SQL Workshop and then SQL Scripts. The
gm

SQL Scripts page appears.


6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

318 Practice: Extending Application Capabilities


8. Click Create. The Script Editor appears.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

9. In the Script Name, enter a name for the script - Employee details and Expense
status.

to
e
10. Enter the SQL statements.

s
en
Copy the code below and paste it into the code editor:

lic
CREATE TABLE "EMPLOYEE_DETAILS"

bl e
("EMPNO" NUMBER GENERATED BY DEFAULT ON NULL

ra
AS IDENTITY MINVALUE 1 MAXVALUE 9999999999999999999999999999

sfe
INCREMENT BY 1 START WITH 8000 CACHE 20 NOORDER NOCYCLE NOKEEP

an
NOT NULL ENABLE,
"EMP_NAME" VARCHAR2(100),

. n-tr
"MGR" NUMBER(4,0),
CONSTRAINT "EMP_PK" PRIMARY KEY ("EMPNO"));
ide no
insert into EMPLOYEE_DETAILS(empno, emp_name, mgr) values (10,
Gu a

'JOHN', 20);
is as

insert into EMPLOYEE_DETAILS(empno, emp_name, mgr) values (20,


th ) h

'CLARA',30);
us .com

insert into EMPLOYEE_DETAILS(empno, emp_name, mgr) values (30,


'JANE', 40);
e
ail

insert into EMPLOYEE_DETAILS(empno, emp_name, mgr) values (40,


'MATT', null);
gm

commit;
@

CREATE TABLE "EMP_EXPENSE_REQUEST"


6

("REQ_ID" NUMBER GENERATED BY DEFAULT ON NULL


10

AS IDENTITY MINVALUE 1 MAXVALUE 9999999999999999999999999999


diq

INCREMENT BY 1 START WITH 8000 CACHE 20 NOORDER NOCYCLE NOKEEP


sa

NOT NULL ENABLE,


i(

"EMP_NO" VARCHAR2(10),
Al

"EXPENSE_TYPE" VARCHAR2(100),
"ESTIMATED_COST" NUMBER(8,0),
diq

"UPDATED_BY" VARCHAR2(100),
Sa

"STATUS" VARCHAR2(20),
CONSTRAINT "EMP_EXPENSE_REQUEST_PK" PRIMARY KEY ("REQ_ID"));

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 319


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

320
Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to
11. Click Run and Run Now. Now you can see that SQL statements run successfully.

Practice: Extending Application Capabilities


Add Users
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

In this lab, you create users for multilevel management.

1. Navigate to the Administration icon on the Application home page and select Manage
Users and Groups from the drop-down list.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
2. Click Create Multiple Users.
Gu a
is as
th ) h
us .com
e
ail
gm
@

3. Specify the following attributes:


6
10

• For a List of Email Addresses: Enter [email protected], [email protected],


[email protected], [email protected]
diq

• For Usernames: Select Exclude @ domain as part of the username.


sa
i(

• For password and Confirm Password: Enter a password of your wish.


Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 321


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

4.

322
Sa
diq
Al
i(
sa
diq
10
6@
gm
Click Next and Create Valid Users.

ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Extending Application Capabilities


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al

Create a Task Definition


diq
Sa

Create a task definition to configure task parameters, participants, actions, and due dates for
an expense request.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 323


To create a task definition:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

1. In the App Builder, navigate to the Expense Tracker application and select Shared
Components.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
2. Under Workflows and Automations, select Task Definitions.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa

3. Click Create.
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

324 Practice: Extending Application Capabilities


4. Specify the task definition name and define the metadata.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• For Name - Enter Expense Request.


• For Subject - Enter &EXPENSE_TYPE. Expense request for &EMPNAME.
• For Static ID - Enter EXPENSE_REQUEST.
• For Priority - Select 2-High.
Leave Business Administrator and Potential owner blank for now.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@

5.
6

Click Create.
10
diq

6. Under the Settings Section:


sa

• For Task details Page Number - Click the Create Task Details Page button, then
i(

click OK.
Al

• For Actions Source - Select SQL Query.


diq

• For Actions SQL query - Copy the code below and paste it into the code editor:
Sa

select EMP_NAME from employee_details where EMPNO =(select MGR


from employee_details where EMPNO=(select EMPNO from
employee_details where EMP_NAME=:APP_USER))

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 325


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
7. Under Participants Section - Select Participants to assign additional people to the Task
Definition.

an
. n-tr
• Click Add Row.
• For Participant Type - Select Potential Owner
ide no
• For Value Type - Select SQL Query
Gu a
is as

• For Value - Copy the code below and paste it into the code editor:
th ) h

select EMP_NAME from employee_details where EMPNO =(select MGR


from employee_details where EMPNO=(select EMPNO from
us .com

employee_details where EMP_NAME=:APP_USER))


e
ail
gm
@6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

326 Practice: Extending Application Capabilities


8. Click the task definition - Expense Request to continue editing.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
9. Under Parameters Section - Select Add Row and fill in the four parameter fields listed
below:

bl e
ra
Table 1: Extend Application Capabilities | Lab 1: Manage Approvals Component

sfe
an
Static ID Label Data Type

. n-tr
ESTIMATED_COST Estimated Cost String
ide no
Gu a

EXPENSE_STATUS Expense Status String


is as
th ) h

EXPENSE_TYPE Expense Type String


us .com

EXPENSE_TYPE Req Id String


e
ail
gm

Static ID Label Data Type


6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 327


10. Under the Actions section, click the Add Action button.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
Specify the following:
For Name - Enter CREATE_EXPENSE_REPORT_ENTRY.

. n-tr

• For Type - Select Execute Code. ide no
• On Event - Select Create.
Gu a
is as

• For Code: Copy the code below and paste it into the code editor:
th ) h

declare
us .com

l_req_id number;
begin
if :APP_USER = :EMP_NAME then --this is the original initiator
e
ail

l_req_id := :APEX$TASK_ID;
gm

-- create a new record in the Employee Expense Request table


@

EMP_EXPENSE_REQUEST
6

insert into EMP_EXPENSE_REQUEST values


10

(to_number(l_req_id),
diq

:EMPNO,
sa

:EXPENSE_TYPE,
:ESTIMATED_COST,
i(
Al

'',
'PENDING');
diq

end if;
Sa

end;

• Click Create to save the Create Event action.

Copyright © 2023, Oracle and/or its affiliates.

328 Practice: Extending Application Capabilities


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail

11. To Add the next action, Click the Add Action button.
gm
@

Specify the following:


6
10

• For Name - Enter NEXT_APPROVER_OR_UPDATE_STATUS.


diq

• For Type - Select Execute Code.


sa

• On Event - Select Complete.


i(
Al

• For Outcome : Select Approved.


diq

• For Code: Copy the code below and paste it into the code editor:
declare
Sa

l_mgr number;
l_task_id number;
l_request_id number;
l_req_status varchar2(10) :='PENDING';
Begin
if :APP_USER = :MGR_NAME then --this is the first approver

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 329


-- set the request id to be the id of the task created when the
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

request was submitted


l_request_id := :APEX$TASK_ID;
else
-- this is an intermediate approver. Set the request-id from
the corresponding task parameter value
l_request_id := :REQ_ID;
end if;

to
if :ESTIMATED_COST < 50000 then -- the approval is complete

s e
en
update EMP_EXPENSE_REQUEST set status = 'APPROVED',

lic
updated_by=updated_by||'->'||:APP_USER
where req_id = l_request_id and emp_no=:APEX$TASK_PK;

bl e
ra
l_req_status := 'APPROVED';

sfe
else -- the request needs to go through another level of
Approval

an
-- updated the request record with details of the current

. n-tr
approver in the chain of approvers
ide no
update EMP_EXPENSE_REQUEST set updated_by = updated_by||'-
>'||:APEX$TASK_OWNER
Gu a

where req_id = l_request_id


is as

and emp_no=:APEX$TASK_PK;
th ) h

-- create a new task assigned to the manager of the current


us .com

approver
l_task_id := apex_approval.create_task(
e

p_application_id => :APP_ID,


ail

p_task_def_static_id => 'EXPENSE_REQUEST',


gm

p_initiator => :EMP_NAME, -- ensure initiator is the


@

original requestor and not the current task owner


6

p_parameters => apex_approval.t_task_parameters(


10

1 => apex_approval.t_task_parameter(static_id =>


diq

'EXPENSE_TYPE', string_value => :EXPENSE_TYPE),


2 => apex_approval.t_task_parameter(static_id =>
sa

'ESTIMATED_COST', string_value => :ESTIMATED_COST),


i(

3 => apex_approval.t_task_parameter(static_id =>


Al

'REQ_ID', string_value => l_request_id),


diq

4 => apex_approval.t_task_parameter(static_id =>


'STATUS', string_value => l_req_status)
Sa

),
p_detail_pk => :APEX$TASK_PK
);
end if;
end;

Copyright © 2023, Oracle and/or its affiliates.

330 Practice: Extending Application Capabilities


• Click Create to add action.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
12. Again, click the Add Actions button.
Gu a
is as

Specify the following:


th ) h

• For Name - Enter UPDATE_REQUEST_STATUS.


us .com

• For Type - Select Execute Code.


e
ail

• On Event - Select Complete.


gm

• For Outcome - Select Rejected.


@

• For Code: Copy the code below and paste it into the code editor:
6

declare
10

l_mgr number;
diq

l_task_id number;
sa

l_request_id number;
i(

l_req_status varchar2(10) := 'PENDING';


Al

begin
diq

select mgr into l_mgr from employee_details where


emp_name=:APP_USER;
Sa

if :APP_USER = :MGR_NAME then --this is the first approver


l_request_id := :APEX$TASK_ID;
else
l_request_id := :REQ_ID;
end if;-- the request is complete and rejected.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 331


update EMP_EXPENSE_REQUEST set status = 'REJECTED',
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

updated_by=updated_by||'->'||:APP_USER
where req_id = l_request_id and emp_no=:APEX$TASK_PK;
end;

• Click Create and Apply Changes.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@
6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

332 Practice: Extending Application Capabilities


Create a Page to Apply for Expense
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Add a page to submit an Expense request.

1. Click Application ID, Application home page appears.

to
se
en
lic
2. Click Create Page. The Create a Page Wizard appears.

bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h

3. Select Blank page under component and click Next


us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 333


4. Specify Blank Page Attributes.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Under the Page Definition section:


• For Page Number - Type 3
• For Name - Enter Apply for Expense.
• For Page Mode - Select Normal.

to
Under the Navigation section:

s e
• For Use Breadcrumb - Select On.

en
• For Breadcrumb Parent Entry - Select Home(Page 1).

lic
• For Use Navigation - Select On.

bl e
• For Navigation Preference - Select Create a new Entry.

ra
For Icon - Enter fa-file-o.

sfe

an
Click Create Page.

. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

334 Practice: Extending Application Capabilities


5. In the left pane, select the Rendering tab. Right-click Body, select Create Region.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

6. In the Property Editor, edit the appropriate attributes:


e

Under Identification section:


ail
gm

• For Title: Enter New Expense Request.


@

• For Type: Select Form.


6

Under Source section:


10

• For Type: Select SQL Query.


diq

• For SQL query: Copy the code below and paste it into the code editor:
sa

Select e.empno, e.emp_name, m.emp_name as mgr_name


i(
Al

from EMPLOYEE_DETAILS e , EMPLOYEE_DETAILS m


where m.empno(+) = e.mgr
diq

and e.empno = :P3_EMPNO;


Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 335


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a

7. Now, right-click the region (New Expense Request) and select Create Page Item.
is as

• For Name - Enter P3_EXPENSE_TYPE.


th ) h

• For Type – Select, Select List.


us .com

Under List of Values section:


e
ail

• For Type - Select Static values.


gm

• For Static Values - Enter below list and click OK.


@

Table 2: Extend Application Capabilities | Lab 1: Manage Approvals Component


6
10

Display Value Return Value


diq
sa

Internet/Broadband Charges Internet/Broadband Charges


i(
Al

Accommodation Accommodation
diq

Conference Conference
Sa

Misc. Expenses Misc. Expenses

Display Value Return Value

Copyright © 2023, Oracle and/or its affiliates.

336 Practice: Extending Application Capabilities


• For Null Display Value - Enter --Select Expense Type--
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
8. Right-click region (New Expense Request) and select Create Page Item.

. n-tr
• For Name - Enter P3_ESTIMATED_COST.
ide no
• For Type - Select Number Field.
Gu a
is as

9. Select the P3_EMPNO page item and enable the primary key under the Source section and
th ) h

Click Save to apply changes.


us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 337


10. On the Rendering tab (left pane), under Pre-Rendering, right-click Before Header and
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

click Create Process.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
In the Property Editor, enter the following:
Gu a

• For Name - Type Fetch Employee Details for User.


is as
th ) h

• For Type - Select Execute code.


us .com

• For PL/SQL Code - Enter the following PL/SQL code:


select empno into :P3_EMPNO from employee_details where
e

emp_name=:APP_USER;
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

338 Practice: Extending Application Capabilities


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10

Practice: Extending Application Capabilities


6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

339
• For Sequence - Enter 5.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as

11. Click Save.


th ) h
us .com

12. Now add a process on the Processing tab to submit a request. Right-click Processing and
select Create Process.
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

340 Practice: Extending Application Capabilities


In the Property Editor, enter the following:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• For Name - Type Submit Expense request.


• For Type - Select Human Task – Create.
Under the Settings section:
• For Definition - Select Expense request.
• For Details Primary key Element: Select P3_EMPNO

to
• For Success Message: Type Expense Request submitted successfully.

se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 341


13. Under Parameters for the Submit Expense request process:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

a. For Estimated Cost, enter the following:


• For Type - Select ITEM.
• For Value - Select P3_ESTIMATED_COST.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
b. ide no
For Expense Status, enter the following:
Gu a

• For Type - Select Static Value.


is as

• For Value - Type PENDING.


th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

342 Practice: Extending Application Capabilities


c. For Expense Type, enter the following:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• For Type - Select ITEM.


• For Value - Select P3_EXPENSE_TYPE.

to
se
en
lic
bl e
ra
sfe
an
d. For Request ID, enter the following:

. n-tr
• For Type - Select NULL. ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(

14. Click Save


Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 343


15. On the Rendering tab, right-click Body and select Create Button.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

In the Property Editor, enter the following:

• For Button Name - Type SUBMIT_REQUEST.


• For Hot - Select On.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

344 Practice: Extending Application Capabilities


16. Navigate to the Processing tab, select the Submit Expense Request process.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Under the Server-side Condition section:

• For When Button Pressed : Select SUBMIT_REQUEST.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
17. Click Save.
ide no
Create Unified Task Lists
Gu a
is as

Add a Unified Task list page to see the submitted expense request list by a requestor and the
th ) h

Approval list approved or rejected by the approver.


us .com

1. Click Application ID on the right-above corner of the page designer. The Application
e
ail

Home page appears.


gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 345


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

2.

346
Sa
diq
Al
i(

Click Create Page.


sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Extending Application Capabilities


3. Under Components, select Unified Task List and click Next.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a

4. Specify the following page attributes:


is as

• For Page Number - Type 4.


th ) h

For Name - Type My Approvals.


us .com


• For Report Context - Select My Tasks.
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 347


Click Create Page. A unified Task List page is created.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm

5. To create another Unified Task list page, again, click Application ID on the right-above
corner of the page designer. The Application Home page appears.
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

348 Practice: Extending Application Capabilities


6. Click the Create Page button. The Create a Page Wizard appears.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
7. Under Component, select Unified Task List and click Next.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 349


8. Specify the following page attributes:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• For Page Number - Type 5.


• For Name - Type My Expense Requests.
• For Report Context - Select Initiated by Me.

Click Create Page. A unified Task List page was created.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq

Create an Email Template


sa

Add an Email Template to add for before expiry action in the task definition.
i(
Al

To define an email template:


diq
Sa

1. Navigate to the Shared Components page:


• On the Workspace home page, click App Builder.
• Select an Expense Tracker application.
• On the Application home page, click Shared Components.

Copyright © 2023, Oracle and/or its affiliates.

350 Practice: Extending Application Capabilities


2. Under User Interface components, select Email Templates.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
3. On the Email Templates page, click Create Email Template. The Details page appears.
Gu a
is as
th ) h
us .com
e
ail
gm
@

4. Under Identification:
6

• For Template Name - Enter BEFORE EXPENSE EXPIRY EMAIL.


10

• For Email Subject - Copy and paste the below text:


diq
sa

Expense Request FOR #APEX_TASK_SUBJECT# Requires your review


i(
Al
diq

*Note: For substitution strings with the #STRINGNAME# format. You can pass in values
Sa

for these strings using the Placeholder Values dialog box for the Process in Page Designer
or the APEX MAIL API.

5. Under HTML Format:


• For Header - Copy the text below and paste it into the Header:
<b style="font-size: 24px;">My Approvals</b>

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 351


• For Body - Copy the text below and paste it into the Body:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

<strong>Hello #APEX_TASK_OWNER#</strong>,<br>
<br>Please check your "My Approvals" inbox. The expense
request for #EMP_NAME# requires your timely review manner.<br>
<br>Thanks for your kind attention to this matter.<br>
<br>Need to make a change to your Approvals? <a
href="#APPROVAL_URL#">Manage your Approvals here.</a>

to
e
• For Plain Text Format - Copy the text below and paste it into Plain text format:

s
en
lic
Hello #APEX_TASK_OWNER#,

bl e
Please check your "My Approvals" inbox. The expense request for
#EMP_NAME# requires your timely review manner.

ra
Thanks for your kind attention to this matter.

sfe
Need to make a change to your Approval? Manage your Approval

an
here: #APPROVAL_URL#

. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

352 Practice: Extending Application Capabilities


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
6. Click Create Email Template.

an
Update Table Employee Details

. n-tr
1. Navigate to SQL Workshop and click SQL Commands. ide no
Gu a

2. Copy and paste the commands below into the Script Editor to update the Employee
is as

Details Table and execute the command one by one.


th ) h
us .com

Note: The steps to create and populate the EMPLOYEE_DETAILS table are shared in TASK
2. Ensure that you have that table created and populated before running the commands
e
ail

below.
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 353


Add a new column HR_MGR (HR Manager) to the existing Employee table
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

EMPLOYEE_DETAILS and update the existing Employee records as shown below:


insert into EMPLOYEE_DETAILS(empno, emp_name) values (50,
'SOPHIE');

insert into EMPLOYEE_DETAILS(empno, emp_name) values (60,


'ROBIN');

to
Alter table "EMPLOYEE_DETAILS" add "HR_MGR" VARCHAR2(10);

s e
en
Update EMPLOYEE_DETAILS set HR_MGR = 'SOPHIE' where EMPNO in

lic
(10,20);

bl e
Update EMPLOYEE_DETAILS set HR_MGR = 'ROBIN' where EMPNO in

ra
(30,40);

sfe
an
Note: You can also create the two Users, SOPHIE and ROBIN, using the Manage Users

. n-tr
And Groups menu option under Workspace Administration as done in TASK 3.

3. Click Run.
ide no
Gu a
is as

Update Task Definition


th ) h

Add deadline and expiration events in actions for expense requests.


us .com

Navigate to App Builder and select Expense Tracker application. Click Shared Components >
e
ail

Workflows and Automations > Task Definitions and select the Expense Request Task Definition.
gm

1. Under the Deadline section:


6@

• For Due on type - Select interval.


10

• For Due on the interval - Type PT30M.


diq

• For Expiration Policy - Select Expire.


sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

354 Practice: Extending Application Capabilities


2. Select Expense Request.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Under the Actions section - click Add Actions.

Specify the following attributes:

• For Name - Enter BEFORE_EXPIRY.

to
• For Type - Select Send Email.

e
• On Event - Select Before Expire.

s
en
• For Before Expire Interval - Enter PT25M.

lic
• For Success Message - Enter Task will expire in 5 minutes.

bl e
ra
Under the Send Email Settings section:

sfe
• For From - Enter the Email address of your wish.

an
• For To - Enter the Email address of your wish.

. n-tr
• For Email Template - Select BEFORE EXPENSE EXPIRY EMAIL.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 355


3. Click the Set Placeholder Values button beside the email template.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Add a Column or Value for mentioned Placeholders and Click Save to add placeholders.

Table 3: Extend Application Capabilities | Lab 1: Manage Approvals Component

Placeholder Column or Value

to
s e
APEX_TASK_SUBJECT &APEX$TASK_SUBJECT.

en
lic
APEX_TASK_OWNER &APEX$TASK_OWNER.

bl e
ra
EMP_NAME &EMP_NAME.

sfe
APPROVAL_URL Paste the Login URL of your Expense Tracker Application

an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al

4. Click Create to save an action.


diq

5. To add Expire event, click Add Actions and specify the following attributes:
Sa

• For Name - Enter TASK_EXPIRED.


• For Type - Select Execute Code.
• For Execution Sequence - 70
• On Event - Select Expire.

Copyright © 2023, Oracle and/or its affiliates.

356 Practice: Extending Application Capabilities


• For Success Message - Enter Task Expired Successfully.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• For Code: Copy the code below and paste it into the code editor:
begin
apex_approval.add_to_history( 'Task ' || :APEX$TASK_SUBJECT || '
Expired');
end;

to
• Click Create to add action.

se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @

You now know how to manage Approval Components.


10
diq

You may now proceed to the next lab.


sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 357


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

358
Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Extending Application Capabilities


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr
an
sfe
ra
bl e
Application Data

lic
en
Practice: Managing

s e
to
Practice 1: Manage Application Data
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

Oracle APEX allows you to build robust, feature-rich applications against remote, web, and REST
data sources. In this lab, you log in to a remote database, create a database table, and then
register a schema with RESTful Services. You will then create a new application and then

to
consume the REST Data Source we created. Then, you will synchronize the data from REST

s e
Data Source to the Local Database table using REST Data Synchronization.

en
lic
Enable Remote Database Schema to Oracle REST Data Services

bl e
Before starting this lab, you need to provision a new APEX instance or Workspace.

ra
sfe
In this hands-on lab, you will log in to a new, remote APEX workspace, create a table, and then

an
register schema with ORDS.

. n-tr
1. Log in to the new workspace you created.
ide no
Gu a

2. Under SQL Workshop, select SQL Commands.


is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

360 Practice: Managing Application Data


3. Now, copy the following statements and execute them one by one:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

CREATE TABLE "EMP_1"


("EMPNO" NUMBER GENERATED BY DEFAULT ON NULL
AS IDENTITY MINVALUE 1 MAXVALUE 9999999999999999999999999999
INCREMENT BY 1 START WITH 8000 CACHE 20 NOORDER NOCYCLE NOKEEP
NOT NULL ENABLE,
"EMP_NAME" VARCHAR2(10),

to
"MGR" NUMBER(4,0),

e
CONSTRAINT "EMP_1_PK" PRIMARY KEY ("EMPNO"))

s
insert into emp_1(empno, emp_name, mgr) values (10, 'JOHN', 30);

en
insert into emp_1(empno, emp_name, mgr) values (20, 'CLARA',30);

lic
insert into emp_1(empno, emp_name, mgr) values (30, 'JANE', 40);

bl e
insert into emp_1(empno, emp_name, mgr) values (40, 'MATT', null);

ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 361


4. Select RESTful Services under SQL Workshop.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
5. Click the Register Schema with ORDS button.

sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@

6. In the next window, leave the attributes to default and then click Save Schema
6

Attributes.
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

362 Practice: Managing Application Data


7. Now, click Enabled Objects in the left Navigation Menu and then select Create AutoREST
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Object button.

to
se
en
lic
bl e
Under AutoREST Enable Object, select the following and click Create.

ra
8.

sfe
• Set Object Type to TABLE.

an
. n-tr
• Select EMP_1 for Object
ide no
• Copy the Full URL and paste it in your Note pad.
Gu a
is as

Then Click Apply.


th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 363


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
9. Now, please change the Copied URL and replace ords with pls/apex and Workspace

ra
Name with your Actual Workspace name as shown below.

sfe
Copied URL: https://apex.oracle.com/ords/wksp_apexhandsonlabs/emp34/

an
Updated URL: https://apex.oracle.com/pls/apex/apex_handson_labs/emp_1/

. n-tr
Create an Application and Integrate Application Data from REST Data Source
ide no
Gu a

In this lab, you create a New Application and then consume the REST Data Source we created
is as

in the previous task. Then, you will synchronize the Data from REST Data Source to the Local
th ) h

Database table using REST Data Synchronization.


us .com

1. Log in to the first workspace, where we have already created multiple applications.
e
ail

2. Select App Builder under Workspace Home Page.


gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

364 Practice: Managing Application Data


3. Now click the Create button to create a new application.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
4. Under Create an Application, select New Application.

an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 365


5. Enter the following and click Create Application.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• For Name - Enter Leave Request Approval.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a

6. Navigate to Shared Components and then Select REST Data Sources.


is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

366 Practice: Managing Application Data


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

7.
Sa
diq
Al
i(
sa

Practice: Managing Application Data


diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
Under REST Data Sources, click the Create button.

ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

367
8. Under Create REST Data Source - Method, leave the settings to default and select Next.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
9. Under Create REST Data Source, enter the following and click Next.

. n-tr
• For REST Data Source Type - select Oracle REST Data Services.
ide no
• For Name - Enter Employee Details API.
Gu a

• For URL Endpoint - Enter the URI we copied in Task 1.


is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

368 Practice: Managing Application Data


10. Now, under Create REST Data Source - Remote Server, leave all fields to Default and
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

then click Next.

to
se
en
lic
bl e
ra
sfe
an
11. For Authentication, set Authentication Required to No. Click Discover.

. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 369


12. Click the Create REST Data Source button.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
Synchronize Data from REST Data Sources to a Local Table

. n-tr
ide no
In this lab, you will synchronize data from the REST Data source you created in Task 2 to a
Local table.
Gu a
is as

The Data Synchronization feature enables developers to automatically sync the contents of a
th ) h

local table with the data from an external REST service. Basically, APEX invokes the REST Service
us .com

defined in the REST Data Source, downloads all data, and synchronizes it to a local table.
e
ail

1. Now that you have created a REST Data Source, Under REST Data Sources, select No
gm

under the Synchronized column for Employee Details API.


6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

370 Practice: Managing Application Data


2. Synchronization is not configured yet. In this step, you provide the name of a new table or
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

an existing table. In this example, select New Table for Synchronize To and enter EMP_2 for
Table Name. Then, click Save.

3. The synchronization table is not created yet. You can view the SQL that is used to create
the table. Click Show SQL.

to
4. Under Table Status, click Create Table. The table EMP_2 is now ready for synchronization.

e
Notice the message The synchronization table exists and matches the Data Profile.

s
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

5. You will define a synchronization schedule now. In the Synchronization Schedule field,
e

you can use the Database Scheduler calendaring syntax to define repeating
ail

synchronization schedules, such as "every Tuesday and Friday at 4:00 p.m." or "the second
gm

Wednesday of every month." This calendaring syntax can be provided manually. Click the
@

Schedule Builder button next to Synchronization Schedule.


6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 371


6. The Interval Builder dialog box is displayed. In this example, for Frequency, select Minutely
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

and enter 10 for Interval. Then, click Set Execution Interval.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
7. ide no
You are now ready to test the data synchronization. Click Save and Run.
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10

8. You can see that data synchronization is triggered.


diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

372 Practice: Managing Application Data


You now know how to log in to a remote database, create a database table, and then register a
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

schema with RESTful Services. Also, how to create a new application, consume the REST
Data Source and synchronize the data from a REST Data Source to the Local Database table
using REST Data Synchronization.

You may now proceed to the next lab.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 373


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

374
Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Managing Application Data


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr
an
sfe
ra
bl e
lic
en
in your Application

s e
to
Practice: Implement Security
Practice 1: Create Authentication and Authorization Schemes
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview
Application security is very important for the majority of applications. You must
ensure that users enter valid credentials. Generally, username and password
(Authentication) and the logged-in user has appropriate rights within the application

to
(Authorization).

s e
en
Estimated Time: 20 minutes

lic
Downloads

bl e
• Did you miss out on trying the previous labs? Don’t worry! You can download the

ra
application from here and import it into your workspace. To run the app, please run

sfe
the steps described in Get Started with Oracle APEX and Using SQL

an
Workshop workshops.

. n-tr
Implement Social Sign In(Facebook) Authentication in Online Shopping Cart Application.
ide no
In this hands-on lab, you create a Social Sign-in authentication scheme to enable Facebook
Gu a

Authentication. You test the authentication scheme.


is as
th ) h

1. Log in to Facebook’s developer console. Login to the Meta for Developers using
us .com

your Facebook Credentials and then select My Apps.


e
ail
gm

Note: If you are logging in to the Facebook developer console for the first time, you
@

must follow the below process before navigating to My Apps


6
10

A new user must first click the Get Started link to Create a Facebook for
diq


Developers account.
sa

• This then brings you to a welcome screen that gives you the option to Continue.
i(
Al

Click Continue.
diq

• Review your email and agree or not to the marketing-related communication


from Facebook.
Sa

• Choose an option for who you are. Example, developer, product manager, etc.

Copyright © 2023, Oracle and/or its affiliates.

376 Practice: Managing Application Data


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
2. Click Create App.

i(
sa

Practice: Managing Application Data


diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
3. Under Select an app type, Select Business and then click Next.

lic
en
s e
to

377
4. Now, Under Provide Basic Information, enter the following and click Create App.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• For Display Name, enter APEX Authentication


• For App contact email, enter Your email address.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
5. You will now verify your Facebook account by Re-entering your password.
Gu a
is as
th ) h
us .com
e
ail
gm
@
6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

378 Practice: Managing Application Data


6. Navigate to Settings and then select Basic. There, you can see the App ID and App Secret.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Copy the App ID and App secret and paste them into your Notepad. It will be used to
create the web credential in your APEX application later.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 379


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

380
Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
7. In the Left Navigation Menu, click on Add Product.

ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Managing Application Data


8. Under Add products to your app, select Set up in Facebook Login card.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
9. Navigate to Settings under Facebook Login in the navigation menu. You have to
enable Client OAuth Login and
ide no
add https://apex.oracle.com/pls/apex/apex_authentication.callback (If you are
Gu a
is as

using apex.oracle.com) Valid OAuth Redirect URIs. Then click on Save Changes.
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 381


10. Login to your APEX workspace and click Workspace Utilities.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
11. Under Workspace Utilities, Select Web Credentials.

. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq

12. Click Create.


sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

382 Practice: Managing Application Data


13. In the Web Credentials enter the following and click Create. Under Attributes:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• For Name, Enter FB_LOGIN_DEMO


• For Static Identifier, Enter FB_LOGIN_DEMO
• For Authentication Type, select OAuth2 Client Credentials Flow.
• For Client ID or Username, Enter the APP ID you copied in Step 6.

to
• For Client Secret or Password and Verify Client Secret or Password, Enter

e
the App Secret you copied in Step 6.

s
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 383


14. Navigate to App Builder and select Online Shopping Application.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
15. Click Shared Components.

an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@

16. Under Security, Select Authentication Schemes.


6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

384 Practice: Managing Application Data


17. In the Authentication Schemes page, click Create.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
18. Under Create Authentication Scheme Page, leave the settings to default and click Next.

lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10

19. In the Authentication Scheme enter the following and click Create
diq

Authentication Scheme. Under Name:


sa
i(

• For Name, Enter FB Authentication.


Al

• For Scheme Type, select Social Sign-In.


diq
Sa

Under Settings:

• For Credential Store, Enter FB_LOGIN_DEMO.


• For Authentication Provider, select Facebook.
• For Scope, Enter email.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 385


• For Username, Enter name.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm

20. Notice that a new Authentication Scheme you created is displayed as FB Authentication
- Current.
@
6
10
diq
sa
i(
Al
diq
Sa

21. Run the application by navigating to Online Shopping Application and click Run.

Copyright © 2023, Oracle and/or its affiliates.

386 Practice: Managing Application Data


22. In the User Interface, click Administration.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
23. Now, log in to the application using your Facebook Credentials.

an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 387


24. You are now logged in to the Online Shopping Application. Check the user name on the
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

top right of the Navigation Bar.

to
s e
en
lic
bl e
ra
sfe
an
Creating and Using an Authorization Scheme

. n-tr
In this task, you create an Authorization Scheme to ensure only people entered as Team
ide no
Members can log into the Online Shopping Application. You apply the authorization
Gu a

scheme to the application properties.


is as
th ) h

1. Navigate to App Builder and select Online Shopping Application.


us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

388 Practice: Managing Application Data


2. In the application home page, click Shared Components.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
3. Under Shared Components > Security, click Application Access Control.

ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

4. Under Roles, Select Add Role.


e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 389


5. In the Role Page, enter the following and click Create Role.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

a. For Name, Enter Administrator


b. For Static Identifier, select ADMINISTRATOR

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@
6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

390 Practice: Managing Application Data


6. In the User Role Assignments, Click Add User Role Assignment.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
7. In the User Assignment Page, enter the following and click Create Assignment.
Gu a
is as

a. For User Name, Enter AUTHORIZED USER.


th ) h

b. For Application Role, Check ADMINISTRATOR to Yes


us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 391


8. Navigate back to Shared Components and then select Authorization Schemes.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@

9. Under Authorization Scheme, Click Create.


6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

392 Practice: Managing Application Data


10. For Create Authorization Scheme, Leave the settings to default and then click Next.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
11. In the Details section of Create Authorization Scheme, enter the following and click Create
Authorization Scheme.
Gu a
is as

a. For Name, Enter Admin.


th ) h
us .com

b. For Scheme Type, Select Is In Role or Group.


c. For Type, select Application Role
e
ail

d. For Name(s), Select Administrator.


gm

e. For Identify error message displayed, enter You are not Authorized to
@

view this.
6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 393


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

394
Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to
12. Navigate to Shared Components and then under Security, Select Security Attributes.

Practice: Managing Application Data


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
13. In the Edit Security Attributes Page, under Authorization,
select Admin for Authorization Scheme. Click Apply Changes.

lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq

14. Navigate to the runtime environment (tab or window). Click Sign Out in the
sa

navigation bar (top right).


i(
Al

15. Run the application by navigating to Online Shopping Application and click Run.
diq

In the User Interface, click Administration.


Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 395


16. Since your name is not Authorized User, verify the access denied message is displayed.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq

Summary
Sa

You now know how to create a Social Sign-in authentication scheme to enable
Facebook Authentication

Copyright © 2023, Oracle and/or its affiliates.

396 Practice: Managing Application Data


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr
an
sfe
ra
bl e
lic
en
s e
to
Pages to your Application
Practice: Adding Additional
Practice 1: Adding Additional Pages to Your Application
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

In this hands-on lab, you will add Calendars, Charts, Tree pages, and Maps to the Demo
Projects application and to the Online Shopping application.

to
Downloads

s e
• Did you miss out on trying the previous labs? Don’t worry! You can download the

en
application from here and import it into your workspace. To run the app, please run

lic
the steps described in Get Started with Oracle APEX and Using SQL Workshop

bl e
workshops.

ra
sfe
Create a Calendar

an
1. Navigate to App Builder and in the Home Page, click Demo Projects.

. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

398 Practice: Adding Additional Pages to your Application


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

3.
2.

Sa
diq
Al
i(
sa
diq
10

Select Calendar page type.


6@
gm

Practice: Adding Additional Pages to your Application


ail
us .com
e
th ) h
is as
In the application home page, click Create Page.

Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

399
4. In the Create Calendar page, enter the following and click Next:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Under Page Definition:


• For Name, Enter Calendar.
Under Data Source:
• For Table / View Name, select DEMO_PROJECTS.

to
Under Navigation:

e
• Set Breadcrumb and Navigation to Yes.

s
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@
6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

400 Practice: Adding Additional Pages to your Application


5. In the Create Calendar page, enter the following and click Create Page.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• For Display Column, select TASK_NAME.


• For Start Date Column, select START_DATE.
• For End Date Column, select END_DATE.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

6. Click Save and Run Page. Log in to the application with your credentials.
e
ail

7. In the Developer Toolbar, click Edit Page.


gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Adding Additional Pages to your Application 401


8. The Calendar page displays the region title Calendar, and also has a border around the
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

region. In the Rendering tree, locate the Calendar region. Click Calendar. In the Property
Editor, under Appearance, click the Template Options button.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
9. In the Template Options dialog box, input the following:
ide no
• Header - select Hidden but accessible.
Gu a

• Style - select Remove UI Decoration.


is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

402 Practice: Adding Additional Pages to your Application


Create a Form Page on DEMO_PROJECTS Tables
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

In this lab, you will create a Form Page on the DEMO_PROJECTS tables, then in the next labs,
you will link the form to the Calendar Page.

1. Navigate to App Builder and in the Home Page, click Demo Projects. Then, click
Create Page.

to
se
en
lic
bl e
ra
sfe
an
2. Select the Form page type.

. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Adding Additional Pages to your Application 403


3. In the Create Form, enter the following and click Next.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Under Page Definition:


• For Page Number, enter 9.
• For Name, enter Form on Projects.
• For Page Mode, select Modal Dialog.

to
Under Data Source:

s e
• For Table / View Name, select DEMO_PROJECTS.

en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

404 Practice: Adding Additional Pages to your Application


4. In the Create Form page, enter the following and click Create Page.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• For Primary Key Column 1, select ID (Number).

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

Customize the Calendar Page


e
ail

In this lab, you will link the form page you created in Task 2 with the Calendar page.
gm
@

1. Navigate to Calendar in the runtime environment and then click Page.


6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Adding Additional Pages to your Application 405


2. You need to add the Create and View / Edit links. In the Rendering tree, locate and select
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

the Calendar region. In the Property Editor, click Attributes. Then, Under Settings, Select
ID for Primary Key and then locate Create Link and click No Link Defined.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
3. In the Link Builder – Create Link dialog box, select 9 for Page, and enter 9 for Clear Cache.
ide no
Click OK.
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

406 Practice: Adding Additional Pages to your Application


4. In the Property Editor, locate View/Edit Link and click No Link Defined.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

5. In the Link Builder – View / Edit Link dialog box, input the following:
• Page - select 9.
• Name - select P9_ID
• Value - select ID or enter &ID.

to
• Clear Cache - enter 9.

se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq

6. You can enable calendar drag and drop by using the component attribute Drag and Drop.
sa

Your SQL query must select a primary key column, and you must have set the Primary
i(

Key Column calendar attribute. Then enter the PL/SQL code to update the event row in
Al

the database in the Drag and Drop PL/SQL Code attribute. That PL/SQL code typically
diq

performs a SQL update on the database table - the bind variables:


Sa

APEX$PK_VALUE, :APEX$NEW_START_DATE, and :APEX$NEW_END_DATE contain the


dragged events primary key value as well as the new start and new end timestamp.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Adding Additional Pages to your Application 407


Under Settings:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• For Drag and Drop, set it to Yes.


• For Drag and Drop PL/SQL Code, copy and paste the below code:
begin
update DEMO_PROJECTS
set start_date =
to_date(:APEX$NEW_START_DATE,'YYYYMMDDHH24MISS'),

to
end_date = to_date(:APEX$NEW_END_DATE,'YYYYMMDDHH24MISS')

e
where ID = :APEX$PK_VALUE;

s
en
end;

lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

408 Practice: Adding Additional Pages to your Application


7. Click Save and Run Page. Notice that you can now drag and drop tasks in the calendar. In
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

the Developer Toolbar, click Application< n >

to
se
en
lic
bl e
ra
sfe
an
. n-tr
Create and Customize a Tree Page
ide no
In this hands-on lab, you create the Employee tree by first creating a blank page and then
Gu a
is as

adding a Tree region.


th ) h

1. First, create a blank page in the Demo Projects application. In the application home page,
us .com

click Create Page.


e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Adding Additional Pages to your Application 409


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

3.
2.

410
Sa
diq
Al
i(
Select Blank Page.

sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
Enter Tree Page for Name and then click Create Page.
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Adding Additional Pages to your Application


4. Now, you create a Tree region. In the page designer, under Rendering, right-click Body
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

and select Create Region.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as

5. In the property editor, enter the following:


th ) h

Under Identification:
us .com

• For Name, enter Tree.


• For Type, select Tree.
e
ail
gm

Under Source:
• For Type, select SQL Query.
6 @

• For SQL Query, copy the following code and paste it:
10

select case when connect_by_isleaf = 1 then 0


diq

when level = 1 then 1


sa

else -1
i(

end as status,
Al

level,
"ENAME" as title,
diq

null as icon,
Sa

"EMPNO" as value,
"ENAME" as tooltip
from EBA_DEMO_IR_EMP
start with "MGR" is null
connect by prior "EMPNO" = "MGR"
order siblings by "ENAME"

Copyright © 2023, Oracle and/or its affiliates.

Practice: Adding Additional Pages to your Application 411


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as

6. In the page designer, navigate to Appearance and then click the Template Options
th ) h

button.
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

412 Practice: Adding Additional Pages to your Application


7. In the Template Options dialog box:
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• General: Select the Remove Body Padding check box.


• Header: Select Hidden but accessible.
• Style: Select Remove UI Decoration. Click OK.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm

8. In the Property Editor, Select Attributes. Navigate to Settings and select / enter
@

the following:
6
10

• Node Label Column: TITLE


diq

• Node Value Column: VALUE


sa

• Hierarchy: Not Computed


i(

• Node Status Column: STATUS


Al

• Hierarchy Level Column: LEVEL


diq

• Tooltip: Database Column


Sa

• Tooltip Column: TOOLTIP

Copyright © 2023, Oracle and/or its affiliates.

Practice: Adding Additional Pages to your Application 413


Then, click Save and Run Page.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

9. The Tree Page is now displayed.


e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

You now know how to add Calendars and Tree pages.

You may now proceed to the next lab.

Copyright © 2023, Oracle and/or its affiliates.

414 Practice: Adding Additional Pages to your Application


Practice 2: Add Map to Your Application
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

In this lab, you will first create a Map Page with Store Details, and then you will create an entry
for the Store Details Map in the navigation Menu Entry.

to
Downloads

se
• Did you miss out on trying the previous labs? Don’t worry! You can download the

en
application from here and import it into your workspace. To run the app, please run

lic
the steps described in Get Started with Oracle APEX and Using SQL Workshop

bl e
workshops.

ra
sfe
an
Create a Store Details Map Page and Add It to Desktop Navigation Bar

. n-tr
1. Navigate to App Builder and in the Home Page, click Online Shopping Application.
ide no
2. In the application home page, click Create Page.
Gu a
is as

3. Select Map page type.


th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Adding Additional Pages to your Application 415


4. In the Create Map page, enter the following and click Next.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Under Page Definition:


• For Page Number, enter 20.
• For Name, enter Store Locations Map.

Under Data Source:

to
• For Table/View Name, select STORES.

s e
en
Under Navigation:

lic
• For Breadcrumb, set it to No.

bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa

5. For Create Map, enter the following and click Create Page. For Map Style, select Points.
i(

Under Map Attributes:


Al

• For Geometry column Type, select Two Numeric Columns.


diq

• For Longitude Column, select LONGITUDE.


Sa

Copyright © 2023, Oracle and/or its affiliates.

416 Practice: Adding Additional Pages to your Application


• For Latitude Column, select LATITUDE.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

• For Tooltip Column, select STORE_NAME.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

6. The Store Locations Map should be visible to the Public. To set the page as Public, select
e
ail

Page #: Store Locations Map in the Rendering tree. In the Property Editor, navigate to
gm

Security, and for Authentication, select Page is Public.


6 @
10
diq
sa
i(
Al
diq
Sa

7. Then, click Save and Run Page.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Adding Additional Pages to your Application 417


8. The Store Details Map Page is now displayed. Now, in the developer toolbar, select
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

App < n >.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
9. Navigate to Shared Components.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@

10. In the Shared Components page, under Navigation, select Navigation Bar List.
6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

418 Practice: Adding Additional Pages to your Application


11. Select Navigation Bar, under Lists.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
12. Click Create Entry.

se
en
lic
bl e
ra
sfe
an
. n-tr
13. For List Entry, enter the following and click Create List Entry.

Under Entry:
ide no
Gu a

• For List Entry Label, enter Store Locations Map.


is as
th ) h

Under Target:
us .com

• For Page, select 20.


e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Adding Additional Pages to your Application 419


14. Then, click Save and Run Page.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
15. You can now see that Store Locations Map is now displayed in Navigation Bar.

s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

You now know how to manage Map pages. You may now proceed to the next lab.
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

420 Practice: Adding Additional Pages to your Application


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr
an
sfe
ra
bl e
Practice: Migrate

lic
en
s e
to
Between Environments
Application Development
Practice 1: Migrate Applications
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview

In this lab, You will create Installation scripts and Data Packages to export Database objects
along with Data. Then you will export the DEMO PROJECTS Application along with supporting
objects and import it into another workspace.

to
e
Objectives

s
en
In this lab, you will:

lic
bl e
• Create Installation Scripts

ra
• Create Data Packages

sfe
Export application with supporting Objects.

an
Downloads

. n-tr
• Did you miss out on trying the previous labs? Don’t worry! You can download the
application from here and import it into your workspace. To run the app, please run
ide no
the steps described in Get Started with Oracle APEX and Using SQL
Gu a

Workshop workshops.
is as

Create Installation Scripts, Data packages, and Export Applications.


th ) h
us .com

Before starting this lab, you need to provision a new APEX instance or Workspace.
e
ail

In this hands-on lab, you will log in to a new, remote APEX workspace, create a table, and then
gm

register schema with ORDS.


@

1. On the Workspace home page, click the App Builder icon.


6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

422 Practice: Managing Application Data


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

3.
2.

Sa
diq
Al
i(
sa

Practice: Managing Application Data


diq
10
6@
gm
ail
Select the Demo Projects application.

us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
Click Supporting Objects. The Supporting Objects page appears.

bl e
lic
en
s e
to

423
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

5.
4.

424
Sa
diq

Click Create.
Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
Under Installation, Select Installation Scripts.

is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Managing Application Data


6. Select Create from Database Object under Create Script.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as

7. Under Script Attributes, select the below options and click Next.
th ) h
us .com

a. For Name, Select Database Objects.


e

b. For Object Type, select Table**


ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 425


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h

8. Now set the following attributes and then click Next.


us .com

a. For Table Options, Select the Checkbox.


e
ail

b. For Object, Select and Move the


gm

tables DEMO_PROJECTS and EBA_DEMO_IR_EMP to the right side.


@
6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

426 Practice: Managing Application Data


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa

Practice: Managing Application Data


diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

427
9. You will now see the Scripts created. Click Create.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

10. Now, you will see that the Scripts got created and Saved. You will need to include Data in
your Supporting Objects. Select Create Data Package under Tasks on the Right side of
e
ail

your page.
gm
6 @
10
diq
sa
i(
Al
diq
Sa

11. Under Script Attributes, Select the following and click Next.

a. For Name, select data.sql

b. For Tables, ensure DEMO_PROJECTS and EBA_DEMO_IR_EMP are listed on


the right side, and if not, select and shuttle these two tables over there.

Copyright © 2023, Oracle and/or its affiliates.

428 Practice: Managing Application Data


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Sa
diq
Al
i(
sa

Practice: Managing Application Data


diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no

12. For Create Script, accept the defaults and click Finish.
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

429
13. The Scripts are now Created. Navigate back to the application and Select Export/Import.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

14. Select Export and click Next.


e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

430 Practice: Managing Application Data


15. In the Export Application page, Under Export Preferences, select Yes and Install on
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Import Automatically and Click Export.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com

16. You will now notice that the application is downloaded as fNNN.sql
e
ail
gm
6 @
10

Import Application into the Target Workspace and Verify Database Objects.
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 431


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

1.

432
Sa
diq
Al
i(
sa
diq
10
6@
Log in to the Target Workspace.

gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Managing Application Data


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

3.
2.

Sa
diq
Al
i(
sa

Practice: Managing Application Data


diq
10
6@
gm

Under Import, click Drag and Drop.


ail
us .com
e
Click App Builder and then select Import.

th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

433
4. Choose the file we exported in the previous lab from your Local System and then
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

click Next.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail

5. Under Install, Set Build Status to Run and Build Application. Leave the remaining
gm

settings to default and Click Install Application.


6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

434 Practice: Managing Application Data


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

6.
Sa
diq
Al
i(
sa

Practice: Managing Application Data


diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to
For Supporting Objects, Set Install Supporting Objects to yes and then click Next.

435
7. Click Install.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a

8.
is as

You will now see that Your application's supporting objects have been installed.
th ) h

Click Edit Application to review the Database Objects.


us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

436 Practice: Managing Application Data


9. Click on the Arrow mark next to SQL Workshop and then click Object Browser.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as

10. Select DEMO_PROJECTS table and then click Data. Verify the Data in the
th ) h

table DEMO_PROJECTS.
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 437


Practice 2: Remote Deployment
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Overview
In this lab, You will be using Remote Deployment to deploy your Application from
Development to UAT. The ORDS feature, REST Enabled SQL is not available
for apex.oracle.com users. Therefore, you will not be able to perform this lab in the

to
hosted instance apex.oracle.com. You should be using APEX Service or APEX on

e
Autonomous Database options for this lab.

s
en
Objectives

lic
bl e
In this lab, you will:

ra
• Export application with supporting Objects.

sfe
Use Remote Deployment to deploy your Application.

an
Downloads

. n-tr
• Did you miss out on trying the previous labs? Don’t worry! You can download the
ide no
application from here and import it into your workspace. To run the app, please run
the steps described in Get Started with Oracle APEX and Using SQL
Gu a

Workshop workshops.
is as
th ) h

Import Sample Application


us .com

The ORDS feature, REST Enabled SQL is not available for apex.oracle.com users.
e
ail

Therefore, you will not be able to perform this lab in the hosted instance
gm

apex.oracle.com. You should be using APEX Service or APEX on Autonomous


Database options for this lab.
6 @

In this Lab, You will install a Sample Application in a new workspace you created
10

either on APEX Service or APEX on Autonomous Database. Please follow the steps
diq

in Get Started with Oracle APEX workshop to provision an instance or to create


sa

workspace on APEX Service or APEX on Autonomous Database.


i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

438 Practice: Managing Application Data


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

1.

Sa
diq
Al
i(
sa

Practice: Managing Application Data


diq
10
6@
gm
ail
us .com
e
Log in to the new Workspace you created.

th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

439
2. Once you Navigate to Gallery, Click Sample Apps.
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a

3. Now that you are in Sample Apps, search for apps by typing "Reporting" into the "Search
is as

Apps" search box and navigate to Sample Reporting and click the Install Button.
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

440 Practice: Managing Application Data


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

4.

Sa
diq
Al
i(
sa

Practice: Managing Application Data


diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
On the Install Application page, click the Install Application Button.

lic
en
s e
to

441
5. You can now see that the application is installed. Run the application by
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

selecting Run Application.

to
s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail

6. Log in to the Sample Reporting application as an End User. Enter


gm

your Username and Password (Same as your Workspace credentials) and click Sign In.
6@
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

442 Practice: Managing Application Data


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @

7. You now see the Sample Reporting application home page. In your Runtime environment
10

under Developer Toolbar, click Home to return to the home page of the APEX
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 443


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

8.

444
Sa
diq
Al
i(

Click App Builder.


sa
diq
10
development environment.

6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Managing Application Data


9. Toggle between the View Icons and the View Reports buttons. You see that applications
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

are displayed along with their icons and report format.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 445


Configure the Target System
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

In this Lab, You will enable the Target System to ORDS, and then you will copy the
URL and paste it into your notepad.

Note: You need to provision a new APEX Service or APEX on Autonomous


Database and create a new workspace in order to perform this lab.

to
1. Log in to your Target System.

s e
en
lic
bl e
ra
sfe
an
. n-tr
ide no
2. Navigate to SQL Workshop > RESTful Services.
Gu a
is as
th ) h
us .com
e
ail
gm
6@

3.
10

Click Register Schema with ORDS.


diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

446 Practice: Managing Application Data


4. Review the ORDS Schema Attributes and click Save Schema Attributes. Now, you see a
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

message that the schema has been successfully registered.

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h

5. Navigate to SQL Workshop > Restful Services. Expand RESTful Data Services >
us .com

Modules > oracle.example.hr > empinfo/ GET. Copy the Full URL and paste it into
your Clipboard or Notepad.
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 447


Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

6.

448
Sa
diq
Click Sign Out.

Al
i(
sa
diq
10
6@
gm
ail
us .com
e
th ) h
is as
Gu a
ide no
. n-tr

Copyright © 2023, Oracle and/or its affiliates.


an
sfe
ra
bl e
lic
en
s e
to

Practice: Managing Application Data


Remote Deployment
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Your application is now ready for deployment. Perform the following steps:

1. Log in to your development environment (WS_APEXDEV in this example)

to
se
en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 449


2. Navigate to your application home page. select App Builder and then click Sample
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Reporting.

to
s e
en
lic
bl e
ra
sfe
3. Click Export / Import.

an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
@

4. Select Remote Deployment and click Next.


6
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

450 Practice: Managing Application Data


5. Choose an existing REST Enabled SQL Service or create a new one. In this example, click
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

the Add Deployment Server ( + ) icon next to the Deployment Server select list.

to
se
en
lic
bl e
ra
sfe
6. Enter the base URL for the REST Enabled SQL Service defined for your deployment
server (WS_APEXUAT in this example). The schema in your deployment server has

an
already been enabled for use with ORDS RESTful Data Services in prerequisites.

. n-tr
For Endpoint URL, paste the base URL copied from the deployment instance in the
ide no
previous step(Task 4). The base URL should include the ORDS context root and schema
URL prefix. For example, https://host:8096/ords/apexstage. Then, click Next.
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 451


7. Enter UAT Cred for Credential Name, select Basic Authentication for Authentication
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Type, and turn off the Store Credentials switch. Click Create.

to
s e
en
lic
bl e
ra
sfe
an
8.

. n-tr
Now you see a message that REST Enabled SQL Service has been created. From the
Deployment Server select list, choose the one that you just created. Enter the values
ide no
for Client ID and Client Secret and click Next. In this example, you use Basic
Gu a

Authentication. Therefore, enter the Database user name (deployment schema) for
is as

Client ID and the corresponding password for Client Secret. Then, Click Next.
th ) h
us .com
e
ail
gm
6@
10
diq
sa
i(
Al
diq
Sa

9. The Remote Deployment Options page appears.

Copyright © 2023, Oracle and/or its affiliates.

452 Practice: Managing Application Data


• Under Deploy Application: Set Build Status Override to Run and Build
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

Application.
• Under Export Preferences: For Export Supporting Object Definitions,
select Yes and Install on Import Automatically.
• Under Deployment Overrides: In this example, even though the application
does not yet exist on the target system, turn the Overwrite Existing

to
Application option On so that you can preserve the application ID, and enable
this application for future overwrites.

se
After making the above selections, click Deploy.

en
lic
bl e
ra
sfe
an
. n-tr
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6 @
10
diq
sa
i(
Al
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 453


10. You see the Remote Deployment Successful message. Your application has been
Unauthorized reproduction or distribution prohibited. Copyright© 2023, Oracle University and/or its affiliates.

successfully deployed to the remote server.

to
s e
en
lic
bl e
ra
sfe
an
11. Log in to your remote APEX instance. Make sure that the application is available and with

. n-tr
the same application id as in the source system.
ide no
Gu a
is as
th ) h
us .com
e
ail
gm
6@
10
diq
sa

Summary
i(
Al

You now know how to deploy your Application from Development to UAT.
diq
Sa

Copyright © 2023, Oracle and/or its affiliates.

454 Practice: Managing Application Data

You might also like