0% found this document useful (1 vote)
4K views454 pages

Oracle APEX Developer Professional - Activity Guide

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 (1 vote)
4K views454 pages

Oracle APEX Developer Professional - Activity Guide

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© 2024, Oracle University and/or its affiliates.

D107336GC10
Activity Guide
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha

Learn more from Oracle University at education.oracle.com


us ne
e @
th g
is m
Gu ail
ide .co
. m)
h as
a

Oracle APEX Developer Professional


Copyright © 2023, Oracle and/or its affiliates.
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

a
Restricted Rights Notice

as
If this documentation is delivered to the United States Government or anyone using the documentation on behalf of

h
the United States Government, the following notice is applicable:

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

ide .co
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

Gu ail
"commercial computer software" or "commercial computer software documentation" pursuant to the applicable
Federal Acquisition Regulation and agency-specific supplemental regulations. As such, the use, reproduction,

is m
duplication, release, display, disclosure, modification, preparation of derivative works, and/or adaptation of i) Oracle

th g
programs (including any operating system, integrated software, any programs embedded, installed or activated on

e @
delivered hardware, and modifications of such programs), ii) Oracle computer documentation and/or iii) other

us ne
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
to dha
services. No other rights are granted to the U.S. Government.
se ar

Trademark Notice
en nd

Oracle and Java are registered trademarks of Oracle and/or its affiliates. Other names may be trademarks of their
lic .na

respective owners.
ble r.p

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
ra i
fe am

logo are trademarks or registered trademarks of Advanced Micro Devices. UNIX is a registered trademark of The
Open Group.
ns (s

Third-Party Content, Products, and Services Disclaimer


tra ne
n - ha

This documentation may provide access to or information about content, products, and services from third parties.
Oracle Corporation and its affiliates are not responsible for and expressly disclaim all warranties of any kind with
no ard

respect to third-party content, products, and services unless otherwise set forth in an applicable agreement between
you and Oracle. Oracle Corporation and its affiliates will not be responsible for any loss, costs, or damages incurred
nd

due to your access to or use of third-party content, products, or services, except as set forth in an applicable
agreement between you and Oracle.
Na

1006302023
ir
m
Sa
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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
Practice 2: Install and Run a Sample Application Overview ........................................................... 14

a
as
Practice: Use SQL Workshop ......................................................................................................... 23

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

. m)
Practice 2: Add Columns to the PRODUCTS Table.......................................................................... 27

ide .co
Practice 3: Create a Database Package for Business Logic ........................................................... 42

Gu ail
Practice 4: Create Database Objects Using Quick SQL .................................................................. 51

is m
Practice: Creating a Database Application.................................................................................... 63

th g
e @
Get Started ..................................................................................................................................... 64

us ne
Practice 1: Create an Application Based on Existing Tables .......................................................... 65
to dha
Practice 2: Create an Application from a Spreadsheet .................................................................. 81
se ar

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


en nd

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


lic .na

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


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

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


ra i
fe am

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


ns (s

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


tra ne

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


n - ha

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


no ard

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


nd

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


Na

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


ir

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


m
Sa

Practice: Enhancing your application using Computations, Processes and Validations ........ 229
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© 2024, 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

a
Practice: Extending Application Capabilities................................................................................ 315

as
Practice 1: Manage Approvals Component .................................................................................... 316

h
. m)
Practice: Managing Application Data ............................................................................................. 359
Practice 1: Manage Application Data .............................................................................................. 360

ide .co
Gu ail
Practice: Implement Security in your Application ........................................................................ 375
Practice 1: Create Authentication and Authorization Schemes ..................................................... 376

is m
th g
Practice: Adding Additional Pages to your Application .............................................................. 397

e @
Practice 1: Adding Additional Pages to Your Application .............................................................. 398

us ne
Practice 2: Add Map to Your Application ....................................................................................... 415
to dha
Practice: Migrate Application Development Between Environments ......................................... 421
se ar

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


en nd

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


lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

iv Oracle APEX Developer Professional – Table of Contents


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

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
Database
e @
th g
is m
Gu ail
ide .co
. m)
h
Oracle Autonomous

as
a
with Oracle APEX on the
Practice: Getting Started
Practice 1: Provision an APEX Workspace
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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

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

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

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

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

ide .co
workspace accordingly.

Gu ail
What is an APEX Workspace?

is m
th g
e @
An APEX Workspace is a logical domain where you define APEX applications. Each workspace

us ne
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
to dha
top of these database objects.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p

Where to Run the Lab


ra i
fe am

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

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

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

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

App Dev VM and installing APEX 23.1.


nd

For this course, we will use the free, “Development Only” apex.oracle.com service.
Na
ir

Sign Up for apex.oracle.com


m
Sa

Signing up for apex.oracle.com is simply a matter of providing details on the workspace you
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
3. Scroll down and you will see details for apex.oracle.com. Click Request a Free

is m
Workspace.

th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

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

12
7.
6.

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
Click Continue to Sign In Screen.

fe am
ra i
ble r.p
lic .na
en nd
se ar
Enter your password, and click Change Password.

to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

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© 2024, Oracle University and/or its affiliates.

workspace and username checkbox, and then click Sign In.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
9. You should now be in the APEX Builder.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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

a
• Install and run a packaged application

h as
Tasks

. m)
ide .co
Major Components of APEX

Gu ail
To log in to Oracle APEX, you need a Workspace Name, username, and the password created

is m
for that Workspace. In this hands-on lab, you log in to your Oracle APEX Workspace.

th g
e @
us ne
1. Log in to Oracle APEX Workspace. Perform the following steps:
to dha
a. Open your browser and enter the URL to sign in to the APEX development
environment.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Click Sign In.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s

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


tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a sample or starter app.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd

4. Click SQL Workshop.


lic .na
ble r.p

The SQL Workshop home page appears. Review each of the SQL Workshop components.
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

5. Click Gallery.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd

6. The Gallery page displays a collection of starter applications, sample applications and
lic .na

custom applications that you can install in your workspace.


ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
2. to dha
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.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

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

3.

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha

Practice: Getting Started with Oracle APEX on the Oracle Autonomous Database
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
On the Install Application page, click the Install Application button.

ide .co
. m)
h as
a

19
4. You can now see that the application is installed. Run the application by selecting Run
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

Application.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p

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


ra i
fe am

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

In.
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard

8. Click App Builder.


nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

are displayed along with their icons and report format.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @
th g
is m
Gu ail
ide .co
. m)
h as
a
Practice: Use SQL Workshop
Practice 1: Install a Sample Data Set
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

a
as
In this practice, you will:

h
• Install a sample dataset into your Oracle APEX Workspace

. m)
Task

ide .co
Gu ail
1. Log in to your workspace. If you are already logged in, click the APEX Logo in the upper

is m
left-hand corner of the page to return to the APEX workspace home page.

th g
e @
us ne
Create Customer Order Tables
to dha
2. From the APEX workspace home page, select the down arrow to the right of SQL
se ar

Workshop, then select Utilities to display the options and choose Sample Datasets.
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
4. Leave the settings to default and then click Next.

th g
e @
The schema name defaults to your current schema and hence will be different from the

us ne
schema name shown below. to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 25


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
6. Click Exit.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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

a
PRODUCTS table.

h as
Since many products share the same colors, clothing type, and department, to avoid data

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

ide .co
color, type, and department data. Instead of creating these three tables for yourself, you'll use
the Create Lookup Table feature.

Gu ail
is m
In this practice, you learn how to add these three new columns to the PRODUCTS table and

th g
e @
then create lookup tables for those new columns.

us ne
In this practice, you will: to dha
• Add new columns to the existing PRODUCTS table
se ar
en nd

• Populate the new columns


lic .na

• Create lookup tables


ble r.p
ra i
fe am

Tasks
ns (s

Add Column Title to the PRODUCTS Table


tra ne
n - ha

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


no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 27


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar

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


en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Click Apply.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p

5. Click the Add Column button.


ra i
fe am

6. For the Department column, enter the following:


ns (s

• Add Column - enter DEPARTMENT


tra ne

• Type - select VARCHAR2


n - ha

• Length - enter 200.


no ard

Click Apply.
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 29


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

7.

30
Sa
m
ir
Na
nd
no ard
n - ha

Click the Add Column button.


tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Use SQL Workshop


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

• Add Column - enter CLOTHING


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha

Populate New Columns


no ard
nd

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


Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 31


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
3. Click Create.
to dha
se ar
en nd
lic .na
ble r.p

4. For Script Name, enter Populating new columns.


ra i
fe am
ns (s

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


tra ne

UPDATE
n - ha

(
no ard

SELECT p.product_id,
nd

p.product_name,
Na

p.clothing,
p.color,
ir
m

p.department,
Sa

p.product_details
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© 2024, 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)

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

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

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

h
. m)
COLOR columns, respectively, based on information found in the JSON product details
column in the PRODUCTS table.

ide .co
Gu ail
6. Click Run.

is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 33


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

34
8.
7.

errors.
Sa
m
Click Run Now.

ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a
The Script Results page is displayed listing the statements processed, successful, and with

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© 2024, Oracle University and/or its affiliates.

Commands.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
10. Copy the following SQL query.

us ne
SELECT p.product_name,
p.unit_price, to dha
p.color,
se ar

p.department,
en nd

p.clothing
lic .na

FROM products p;
ble r.p

11. Click Run.


ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Create Lookup Tables

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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd

3. Navigate to the PRODUCTS table.


lic .na

4. Click the Create Lookup Table button.


ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha

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

listed in the Object Browser.


nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 37


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

38
6.

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
Click More and Select Create Lookup Table button.

to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a
To create Department lookup table, navigate back to the Products table and

Practice: Use SQL Workshop


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard

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

the Object Browser.


Na

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

Select Create Lookup Table button.


m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 39


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

9.

40
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
For Text Column, select CLOTHING and Click Create Lookup Table.

ide .co
. m)
h as
a

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© 2024, 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
• DEPARTMENT_LOOKUP

a
as
• CLOTHING_LOOKUP

h
. m)
The numeric value of the COLOR_ID column will now store a reference to the system

ide .co
assigned unique ID of a particular color, whose name is stored in the new
COLOR_LOOKUP table. Similarly, the DEPARTMENT_ID column references the ID of a row

Gu ail
in the DEPARTMENT_LOOKUP table and CLOTHING_ID references the ID of a row in the

is m
th g
CLOTHING_LOOKUP table.

e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

You now know how to add new columns to your existing tables, how to create lookup tables
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© 2024, 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.

a
as
To manage items in the cart, you use collections, which enable you to temporarily store

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

. m)
a user's specific session.

ide .co
Business logic in APEX applications can be written using PL/SQL, Oracle's procedural

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

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

th g
e @
functions, from their implementation.

us ne
In this practice, you will: to dha
• Create a package to manage the Shopping Cart
se ar
en nd
lic .na

Task
ble r.p
ra i

Create the Package


fe am
ns (s

Create specification and body for the package.


tra ne

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


n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
3. For Package Name, enter MANAGE_ORDERS and click Create Package.
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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,
p_quantity IN NUMBER);

a
--------------------------------------------------------------

as
-- create procedure for remove a product temporarily

h
PROCEDURE remove_product (

. m)
p_product IN NUMBER);

ide .co
--------------------------------------------------------------

Gu ail
-- create function to get the number of items in the shopping
cart

is m
th g
FUNCTION Get_quantity

e @
RETURN NUMBER;

us ne
--------------------------------------------------------------
to dha
-- create procedure for validate if a product exists in the
shopping cart
se ar

FUNCTION Product_exists(
en nd

p_product IN NUMBER)
lic .na

RETURN NUMBER;
--------------------------------------------------------------
ble r.p

-- create procedure for clear the cart


ra i
fe am

PROCEDURE clear_cart;
ns (s

--------------------------------------------------------------
-- create function to validate a customer
tra ne

FUNCTION Customer_exists(
n - ha

p_customer_email IN VARCHAR2)
no ard

RETURN NUMBER;
nd

--------------------------------------------------------------
Na

-- create procedure to insert orders


PROCEDURE create_order (
ir

p_customer IN VARCHAR2 DEFAULT NULL,


m
Sa

p_customer_email IN VARCHAR2,
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© 2024, Oracle University and/or its affiliates.

5.

Sa
m
ir

Practice: Use SQL Workshop


Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
Click Save and Compile to save the changes.

en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

45
6. Navigate to the body part of the package by clicking the Body tab and replace the
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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
BEGIN

a
IF NOT apex_collection.collection_exists

as
(p_collection_name => 'PRODUCTS')

h
THEN

. m)
apex_collection.create_collection(p_collection_name =>

ide .co
'PRODUCTS');
END IF;

Gu ail
is m
apex_collection.add_member(p_collection_name =>

th g
e @
'PRODUCTS',

us ne
p_n001 => p_product,
p_n002 => p_quantity); to dha
END add_product;
se ar
en nd

PROCEDURE remove_product (p_product IN NUMBER)


lic .na

IS
l_id NUMBER;
ble r.p

BEGIN
ra i
fe am

IF apex_collection.Collection_exists (p_collection_name =>


'PRODUCTS')
ns (s

THEN
tra ne

SELECT seq_id
n - ha

INTO l_id
no ard

FROM apex_collections a
WHERE collection_name = 'PRODUCTS'
nd

AND a.n001 = p_product;


Na
ir

apex_collection.delete_member(p_collection_name =>
m

'PRODUCTS',
Sa

p_seq => l_id);


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© 2024, 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
WHERE collection_name = 'PRODUCTS';

a
as
END IF;

h
. m)
RETURN l_items;
END get_quantity;

ide .co
Gu ail
FUNCTION product_exists(p_product IN NUMBER)

is m
RETURN NUMBER

th g
e @
IS

us ne
l_quantity NUMBER;
BEGIN to dha
IF apex_collection.collection_exists (p_collection_name =>
se ar

'PRODUCTS')
en nd

THEN
SELECT a.n002
lic .na

INTO l_quantity
ble r.p

FROM apex_collections a
ra i
fe am

WHERE collection_name = 'PRODUCTS'


AND a.n001 = p_product;
ns (s
tra ne

RETURN l_quantity;
n - ha

ELSE
no ard

RETURN 0;
END IF;
nd

EXCEPTION
Na

WHEN OTHERS THEN


ir

RETURN 0;
m

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© 2024, Oracle University and/or its affiliates.

'PRODUCTS');
END IF;
END clear_cart;

FUNCTION customer_exists(p_customer_email IN VARCHAR2)


RETURN NUMBER
IS
l_customer customers.customer_id%TYPE;

a
as
BEGIN
SELECT customer_id

h
. m)
INTO l_customer
FROM customers

ide .co
WHERE email_address = p_customer_email;

Gu ail
is m
RETURN l_customer;

th g
e @
EXCEPTION

us ne
WHEN no_data_found THEN
RETURN 0; to dha
END customer_exists;
se ar
en nd

PROCEDURE create_order (p_customer IN VARCHAR2,


lic .na

p_customer_email IN VARCHAR2,
p_store IN NUMBER,
ble r.p

p_order_id OUT
ra i
fe am

orders.order_id%TYPE,
p_customer_id OUT NUMBER)
ns (s

IS
tra ne

BEGIN
n - ha

p_customer_id := customer_exists(p_customer_email);
no ard

IF p_customer_id = 0 THEN
nd

INSERT INTO customers


Na

(full_name,
ir

email_address)
m

VALUES (p_customer,
Sa

p_customer_email)
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© 2024, Oracle University and/or its affiliates.

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

a
IF apex_collection.collection_exists (p_collection_name =>

as
'PRODUCTS')
THEN

h
. m)
INSERT INTO order_items
(order_id,

ide .co
line_item_id,

Gu ail
product_id,

is m
unit_price,

th g
e @
quantity)

us ne
SELECT p_order_id,
seq_id, to dha
p.product_id,
se ar

p.unit_price,
en nd

n002
lic .na

FROM apex_collections a,
products p
ble r.p

WHERE collection_name = 'PRODUCTS'


ra i
fe am

AND p.product_id = a.n001;


END IF;
ns (s
tra ne

apex_collection.delete_collection(p_collection_name =>
n - ha

'PRODUCTS');
no ard

END create_order;
END manage_orders;
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 49


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
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
se ar

Oracle APEX to handle the user's shopping cart by managing a collection of product id and
en nd

quantity values specific to the current user, and automatically create a new row in
lic .na

the Customers table during order creation if it's the first time the user is placing an order.
ble r.p
ra i

You now know how to create a package to manage the shopping cart. In the following
fe am

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

now proceed to the next practice.


tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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

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

as
a file into your workspace.

h
. m)
In this practice, you’ll:

ide .co
• Create database objects using Quick SQL

Gu ail
• Load data using the Data Workshop page

is m
th g
Tasks

e @
us ne
Create database objects using Quick SQL to dha
1. Return to your APEX Workspace and click '⌄' next to the SQL Workshop tab, click
se ar

Utilities, and then select Quick SQL.


en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

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

a
cost center num

as
date hired

h
job vc255

. m)
ide .co
view emp_v departments employees

Gu ail
is m
Note that the Indentation from the code you copied should be similar to the one we have in the

th g
following screenshot.

e @
us ne
3. Review the shorthand code. How many tables will be created and how are they related?
to dha
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
se ar

its usage.
en nd
lic .na

When ready, in the Quick SQL (left pane) toolbar, click Generate SQL.
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
5. In the Save Script dialog, for Script Name enter Employee Department Details, and
se ar

click Save Script.


en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
7. In the Script Editor page toolbar, click Run.
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na

9. The Results page shows the results of running the script. Scroll to the bottom to see a
summary. You should not see any errors.
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Workshop tab and then select Object Browser.

a
h as
. m)
ide .co
Gu ail
11. Select the EMPLOYEES table and review its columns.

is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
Load Data Using the Data Workshop Utility
to dha
In this step, you will learn how to create a table and Load data using the Data Workshop utility.
se ar
en nd

1. On the Workspace home page, click the '⌄' next to SQL Workshop tab, click Utilities, and
lic .na

then select Data Workshop.


ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 57


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

58
3.
2.

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i

Under Upload a File, click Choose File.


ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
Under Get Started, click Load Data. The Load Data Wizard appears.

ide .co
. m)
h as
a

Practice: Use SQL Workshop


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

a
h as
. m)
Note: If the uploaded XLSX file contains multiple worksheets, the Load Data wizard picks

ide .co
the first sheet by default. To load another sheet, pick it from the Select Sheet select list.

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

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

th g
e @
limited to 20 MB for each file.

us ne
5. Under Load Data, edit the Table Name field and provide an appropriate name. In this
to dha
practice, you will set the Table Name as Projects. Then click Load Data.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
7. Select the PROJECTS table and review its columns.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
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
se ar

load data.
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Use SQL Workshop 61


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

62
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Use SQL Workshop


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

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @
th g
is m
Gu ail
ide .co
. m)
h
Practice: Creating a

as
a
Database Application
Get Started
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

In this lab, you’ll:

a
as
1. Create an application using the tables and data that you already have installed

h
. m)
2. Create a database application from a file

ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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:

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

h as
• Create a database application from a file

. m)
ide .co
Tasks

Gu ail
Sign in to the Oracle APEX Console using your workspace, username, and password.

is m
th g
e @
Create an Application Based on Existing Tables

us ne
1. In the App Builder menu, click App Builder. to dha
se ar

2. Click Create.
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating a Database Application 65


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
Name the Application to dha
se ar

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

that in the Create an Application wizard, the icon and color of the icon will be a random
lic .na

selection, so it most likely will not be the same color or icon that you see in the screenshot.
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

2. Click Dashboard.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd

3. For Chart 1, enter the following:


lic .na

• Chart Type – select Bar


ble r.p

• Chart Name – enter Top 10 Products


ra i
fe am

• Table or View – select PRODUCT_ORDERS


• Label Column – select PRODUCT_NAME
ns (s
tra ne

• Type – select Sum


n - ha

• Value Column – select TOTAL_SALES


no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating a Database Application 67


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p

4. Click Chart 2, and enter the following:


ra i
fe am

• Chart Type – select Pie


ns (s

• Chart Name – enter Top 5 Stores


tra ne

• Table or View – select STORE_ORDERS


n - ha

• Label Column – select STORE_NAME


no ard

• Type – select Sum


nd

• Value Column – select TOTAL_SALES.


Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

68 Practice: Creating a Database Application


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p

5. Click Chart 3, and enter the following:


ra i
fe am

• Chart Type – select Pie


ns (s

• Chart Name – enter Order Status


tra ne

• Table or View – select CUSTOMER_ORDER_PRODUCTS


n - ha

• Label Column – select ORDER_STATUS


no ard

• Type – select Count


nd

• Value Column – select ORDER_ID


Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating a Database Application 69


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na

6. Click Chart 4, and enter the following:


ble r.p

• Chart Type – select Bar


ra i
fe am

• Chart Name – enter Product Reviews


ns (s

• Table or View – select PRODUCT_REVIEWS


tra ne

• Label Column – select PRODUCT_NAME


n - ha

• Type – select Column Value


no ard

• Value Column – select AVG_RATING


nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

70 Practice: Creating a Database Application


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

Sa
m
ir
Na
nd
no ard

Practice: Creating a Database Application


n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne

8. Click Add Page.


n - ha
no ard

Add Multiple Reports


nd

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


Na

2. Click the arrow to the left of Additional Pages to see additional page types.
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

72 Practice: Creating a Database Application


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne

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


n - ha
no ard

• CLOTHING_LOOKUP
• COLOR_LOOKUP
nd

• CUSTOMERS
Na

• DEPARTMENT_LOOKUP
ir
m

• PRODUCT_REVIEWS
Sa

• STORES

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating a Database Application 73


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

74
5.

Sa
m
ir
Click Add Pages.

Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Creating a Database Application


Set Multiple Reports as Administration Pages
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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
• DEPARTMENT_LOOKUP

a
• PRODUCT_REVIEWS

as
• STORES

h
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd

2. For each page you edit, click Advanced and check Set as Administration Page.
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating a Database Application 75


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

76
3.

Sa
m
ir
Na
Click Save Changes.

nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Creating a Database Application


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

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

2. Click Interactive Report.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd

3. On the Report Page, enter the following:


Na

• Page Name - enter Manage Products


ir

• Table - select PRODUCTS


m
Sa

4. Click Advanced and check Set as Administration Page.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating a Database Application 77


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne

Set Features
n - ha
no ard

Features are a set of optional application capabilities in Oracle APEX that you can include in your
new application. Access Control enables role-based user authorization with a single click.
nd
Na

1. Under the Features section, check Install Progressive Web App and Access Control.
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

78 Practice: Creating a Database Application


Finish Creating the Application
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s

2. Once the application is created, you will find the new app on the application home page.
tra ne

Click Run Application.


n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating a Database Application 79


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

1. Enter your user credentials. Click Sign In.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na

The new application will be displayed. Explore the pages that you just created by clicking the
ble r.p

navigation menu.
ra i
fe am

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

existing database objects. You may now proceed to the next lab.
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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

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

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

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

. m)
While APEX developers spend the majority of their time in the App Builder, you should also

ide .co
investigate the SQL Workshop, where you can create and maintain database objects, Team

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

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

th g
e @
Tasks
us ne
to dha
Load Projects data
se ar
en nd

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


lic .na

2. Click Create a New App.


ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd

When creating an application from a file, APEX allows you to upload CSV, XLSX, XML, or JSON
lic .na

files and then build apps based on their data. Alternatively, you can also copy and paste CSV
ble r.p

data or load sample data.


ra i
fe am

4. Within the Load Data wizard, click the Choose File button.
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
After clicking Load Data, you will see a spinner until the wizard finishes loading the data.

us ne
Continue to Task 2 at this point. to dha
Create an application
se ar
en nd

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

the sample data. Now you can create an app based on this new table.
ble r.p
ra i

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

Table, then click Create Application.


ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard

Repeat the steps for Demo Projects Report and Calendar.


nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na

When the wizard finishes creating the application, you will be redirected to the application's
ble r.p

home page in the App Builder.


ra i
fe am

Configure Progressive Web App Attributes


ns (s
tra ne

1. Navigate to the Edit Application Definition page. From the Application home page, you can
n - ha

access the Edit Application Definition page using Shared Components.


no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
3. Now, navigate to Progressive Web App and set Installable to Yes. Click Apply Changes.

is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
2. Enter your user credentials and click Sign In.
se ar
en nd

Note: Use the same Username and Password you used to sign in to the APEX Workspace.
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

system.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
You now know how to create an application from a spreadsheet by either dragging and

us ne
dropping a file or loading sample data for training purposes.
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating a Database Application 89


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

90
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Creating a Database Application


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

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @
th g
is m
Gu ail
ide .co
. m)
h
Pages and Regions

as
a
Practice: Working with
Practice 1: Create Pages, Regions, and Items
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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:

a
• Order number

as
• Order date

h
. m)
• Status

ide .co
• Total price
• Quantity and price of the items.

Gu ail
is m
In this lab, you will:

th g
e @
1. Navigate and review the Page Designer panes

us ne
2. Create a page to review the items that customer just bought
to dha
se ar

Downloads:
en nd

• Did you miss out trying the previous labs? Don’t worry! You can download the application
lic .na

from here and import it into your workspace. To run the app, please run the steps
ble r.p

described in Get Started with Oracle APEX and Using SQL Workshop workshops.
ra i
fe am

Tasks
ns (s
tra ne

Navigate and Review the Page Designer panes


n - ha
no ard

Open the home page in page designer, and navigate through and review the page designer
nd

panes.
Na

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

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

Developer Toolbar, click Page n.

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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
2. The Page Designer is displayed for Page 1. There are three main panes within Page

us ne
Designer: Left Pane, Central Pane, and Right Pane. You can change the size of each pane
to dha
by selecting the dividers and sliding them left or right. Change the size of Grid Layout and
se ar

Gallery by sliding the divider between them up and down.


en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p

4. In the page designer, click Create (the + icon) and select Page.
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard

2. Enter the following:


nd

• Page Number - enter 15


Na

• Name - enter Order Information


ir

Now, click Navigation, and enter the following.


m
Sa

• Breadcrumb - Set to No
• 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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am

Add a Region
ns (s
tra ne

Add a region to the page to display order details.


n - ha

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

showing Regions, Items, and Buttons categories and ensure that Regions is selected.
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
3. In the Property Editor, enter the following:

us ne
• For Title - enter Thank you for your order!
to dha
• For Template - select Content Block
se ar

• For Template Options - Click the rectangular area next to the Template Options label
en nd

to open the Template Options dialog. On the Dialog page, select Show Region
lic .na

Icon and click OK.


ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s

Add Items to the Page


tra ne

Add a hidden item to store the order ID without the user being able to see it.
n - ha
no ard

1. In the Rendering tree (left pane), click the Thank you for your order! region to select it.
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

98 Practice: Working with Pages and Regions


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

2.

Sa
m
ir
Na
nd
no ard

Practice: Working with Pages and Regions


n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
Right-click the region and click Create Page Item.

to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

99
3. In the property editor, set the name and type as follows:
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am

Add Static Content Region


ns (s

Add a region to contain Order details and items.


tra ne
n - ha

1. In the Rendering tree (left pane), click the Thank you for your order! region.
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

100 Practice: Working with Pages and Regions


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

2.

Sa
m
ir
Na
nd
no ard

Practice: Working with Pages and Regions


n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
Right-click the region and click Create Sub Region.

to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

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

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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i

Add Order Details Region


fe am
ns (s

Add a region to display Order details.


tra ne

1. In the Rendering tree (left pane), navigate to the Order: &P15_ORDER. region.
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
3. In the Property Editor, enter the following:
se ar

• For Title - enter Order Details


en nd

• For Type - select Cards


lic .na

• Under Source section:


ble r.p

 For Type - select SQL Query


ra i
fe am

 For SQL Query - enter the following SQL Query:


ns (s
tra ne

SELECT o.order_id,
n - ha

o.order_datetime,
no ard

o.customer_id,
nd

o.order_status,
o.store_id,
Na

(SELECT Sum(unit_price * quantity)


ir

FROM order_items i
m

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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd

4. Click Attributes.
lic .na

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


ble r.p

 Set Advanced Formatting to On


ra i
fe am

 For HTML Expression - enter:


ns (s
tra ne

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


n - ha

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


no ard

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


nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

104 Practice: Working with Pages and Regions


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar

Add Items Region


en nd
lic .na

Add a region to display items in the order.


ble r.p

1. In the Rendering tree (left pane), navigate to the Order: &P15_ORDER. region.
ra i
fe am
ns (s

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


tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Working with Pages and Regions 105


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p

3. In the Property Editor, enter the following:


ra i
fe am

• For Title - enter Items


ns (s

• For Type - select Cards


tra ne

• Under Source section:


n - ha

For Type - select SQL Query


no ard


 For SQL Query - enter the following SQL Query:
nd

SELECT o.line_item_id Item,


Na

p.product_name Product,
ir

o.unit_price,
m

o.quantity,
Sa

( o.unit_price * o.quantity ) Subtotal,


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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na

4. Click Attributes and do the following:


ble r.p

• Under Title section:


ra i
fe am

o For Column - select PRODUCT


ns (s

• Under Secondary Body:


tra ne

o Set Advanced Formatting to On


n - ha

o For HTML Expression - enter:


no ard
nd

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


Na

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


ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Working with Pages and Regions 107


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar

• Under Media section:


en nd

o For Source - select BLOB Column


lic .na

o For BLOB Column - select PRODUCT_IMAGE


ble r.p

o For Position - select Body


ra i
fe am

o For Appearance - select Auto


ns (s

o For Sizing - select Fit


tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

108 Practice: Working with Pages and Regions


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
• Under Card:
to dha
o
se ar

For Primary Key Column - Select ITEM.


en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m

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© 2024, Oracle University and/or its affiliates.

110
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Working with Pages and Regions


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

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @
th g
is m
Gu ail
ide .co
. m)
h as
a
Practice: Developing Reports
Practice 1: Create an Interactive Grid and Smart Filters
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

Downloads

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

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

. m)
steps described in the Get Started with Oracle APEX and Using SQL

ide .co
Workshop workshops.

Gu ail
Tasks

is m
th g
e @
Add an Interactive Grid to the Demo Projects Application

us ne
to dha
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.
se ar
en nd

1. On the Workspace home page, click App Builder. Select the Demo Projects application.
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

112 Practice: Developing Reports


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

3.
2.

Sa
m
ir

Practice: Developing Reports


Click Create Page.

Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h
Under Create a Page, select Component and then select Interactive Grid.

as
a

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

Under Page Definition:


• Page Number: 4
• Page Name: Project Tasks

Under Data Source:


• Table/View Name: DEMO_PROJECTS

a
h as
Under Navigation:

. m)
• Use Breadcrumb: No

ide .co
Gu ail
Click Create Page.

is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

114 Practice: Developing Reports


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

5.
Sa
m
ir

Practice: Developing Reports


Na
nd
no ard
n - ha
tra ne
ns (s
fe am

Save and Run Page on the top right.


ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a
Now that you have created an Interactive Grid page, you can view it by clicking

115
Add Smart Filters to the Demo Projects Application
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am

3. For Create Smart Filters, enter/select the following:


ns (s
tra ne

Under Page Definition:


n - ha

• Page Number: 8
no ard

• Name: Project Tasks Search


nd
Na

Under Data Source:


• Table/View Name: DEMO_PROJECTS
ir
m
Sa

Under Navigation:
• Use Breadcrumb: No

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 117


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

118
Click Next.

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Developing Reports


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

4.

Sa
m
ir

Practice: Developing Reports


Na
nd
Click Create Page

no ard
n - ha
tra ne
On the Select the Filters page:

ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
Leave the remaining details to the defaults

to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

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© 2024, Oracle University and/or its affiliates.

Page.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na

You now know how to create an Interactive Grid page and a Smart Filters page. You may
ble r.p

now proceed to the next practice.


ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Overview

In this practice, you create:


• Application Items and an Application Process
• A Cards page to view Product Details and Customer Reviews in the online Shopping

a
Cart application

as
• A Faceted Search page to view Products

h
. m)
Tasks

ide .co
Gu ail
Create Application Items

is m
th g
This is needed to count the number of items in the shopping cart and the icon to display in the

e @
navigation bar.

us ne
to dha
1. Navigate to Online Shopping Application and click Shared Components.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 121


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

3.
2.

122
Sa

Click Create.
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
Under Application Logic, click Application Items.

to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Developing Reports


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

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

Name Scope

SHOPPING_CART_ICON Application

a
SHOPPING_CART_ITEMS Application

h as
. m)
ide .co
5. Click Create Application Item and create the second item.

Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
2. Under Application Logic, click Application Processes.

ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha

3. Click Create and enter/select the following:


no ard

• Name: Initialize Shopping Cart Header


nd

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


Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

124 Practice: Developing Reports


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p

4. Click Next.
ra i
fe am

5. For Code, enter:


ns (s

-- Initialize shopping cart navigation bar to show appropriate


tra ne

icon and count


n - ha

DECLARE
no ard

l_cnt NUMBER := manage_orders.get_quantity;


BEGIN
nd

IF l_cnt > 0 THEN


Na

:SHOPPING_CART_ITEMS := l_cnt;
ir

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

ELSE
Sa

:SHOPPING_CART_ITEMS := '';
: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© 2024, Oracle University and/or its affiliates.

6.

126
Click Next.

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Developing Reports


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am

Create a Normal Page - Shopping Cart


ns (s
tra ne

The shopping cart page allows users to review and edit the products in the cart. Users can also
n - ha

create an order or clear the shopping cart.


no ard

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


nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 127


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

3.
2.

128
Sa
m
ir
Click Create Page.

Na
nd
no ard
n - ha
tra ne
ns (s
fe am Select Blank Page and click Next.
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Developing Reports


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

Under Page Definition:

• Page Number: 16
• Name: Shopping Cart

Under Navigation:

a
• Use Breadcrumb: No

h as
• Use Navigation: No

. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
3. In the Property Editor, enter/select the following:
to dha
Under Identification:
se ar
en nd

• Title: Shopping Cart


lic .na

Under Source:
ble r.p
ra i

• Type: SQL Query


fe am

• SQL Query:
ns (s

SELECT seq_id item,


tra ne

p.product_image,
n - ha

p.product_id,
no ard

p.product_name name,
p.unit_price,
nd

n002 quantity,
Na

p.unit_price* n002 subtotal,


ir

b.brand
m

FROM apex_collections a,
Sa

products p,
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p

4. Click Attributes and enter/select the following:


ra i
fe am

Under Appearance:
ns (s

• Layout: Horizontal (Row)


tra ne

Under Title:
n - ha

• Column: NAME
no ard

Under Subtitle:
nd

• Column: BRAND
Na

Under Body:
ir
m

• Advanced Formatting: On
Sa

• HTML Expression:
Quantity: &QUANTITY.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 131


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i

Under Secondary Body:


fe am

• Advanced Formatting: On
ns (s

• HTML Expression:
tra ne

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


n - ha

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


no ard

Under Media:
nd

• Source: BLOB Column


Na

• BLOB Column: PRODUCT_IMAGE


ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

132 Practice: Developing Reports


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



Sa

Under Card:
m
ir

Practice: Developing Reports


Under Messages:
Na
nd
no ard
n - ha
tra ne

Primary Key Column 1: ITEM


ns (s
fe am
ra i
ble r.p
lic .na

For No Data Found Icon: fa-cart-empty


en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


When No Data Found: Your shopping cart is empty!
th g
is m
Gu ail
ide .co
. m)
h as
a

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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na

3. In the Property Editor:


ble r.p

• For Label, enter Edit.


ra i
fe am

• For Target, enter No Link Defined.


• For Page, enter 17.
ns (s
tra ne

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


n - ha

• Set items as follows:


no ard

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

Name Value
Na
ir

P17_PRODUCT_ID &PRODUCT_ID.
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
This configures the (Edit) button to open page 17, passing the value of the PRODUCT_ID column
to dha
of the current card as the value for the P17_PRODUCT_ID page item in the called page.
se ar
en nd

Create a Modal Page


lic .na
ble r.p

This is to add products to the cart.


ra i
fe am

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


ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard

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


nd

• Page Number: 17
Na

• Name: Add to Cart


ir

• Page Mode: Modal Dialog


m
Sa

Click Create Page.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 137


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne

Add a Cards Region for Product Details


n - ha

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

more.
nd
Na

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


ir

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

Copyright © 2023, Oracle and/or its affiliates.

138 Practice: Developing Reports


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

a
h as
. m)
ide .co
Gu ail
is m
th g
3. In the Property Editor, enter/select the following:

e @
us ne
• Title: Product
Under Source: to dha
• Type: SQL Query
se ar
en nd

• SQL Query:
lic .na

SELECT product_id,
product_name,
ble r.p

unit_price,
ra i
fe am

product_details,
product_image,
ns (s

image_mime_type,
tra ne

image_filename,
n - ha

image_charset,
no ard

image_last_updated,
nd

color_id,
department_id,
Na

clothing_id,
ir

d.description,
m

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© 2024, Oracle University and/or its affiliates.

140



Sa
m

Click OK.
ir

Style: Style C
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd

Template Options: Use Template Defaults


se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Developing Reports


4. Click Attributes and select the following:
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 141


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

142

1)

Sa
m
ir
Na
nd
no ard
n - ha
Under Secondary Body:

Price: &UNIT_PRICE.

tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a
Set Advanced Formatting to On. For HTML Expression, enter the following:

Practice: Developing Reports


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
Add a Cards Region for Customer Reviews

us ne
to dha
This region lets users read the customer reviews for a product.
se ar

1. Navigate to the Gallery Menu.


en nd
lic .na

2. Drag a Cards region and drop it into the Content Body section under the Product region.
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

• Type: SQL Query


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

a
WHERE p.product_name = m.product_name

as
AND p.product_id = :p17_product_id

h
order by m.rating desc

. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

144 Practice: Developing Reports


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

a
h as
. m)
ide .co
Gu ail
is m
th g
4. Click Attributes and enter/select the following:

e @
us ne
Under Appearance:
• Layout: Horizontal (Row)
to dha
Under Title:
se ar
en nd

• Advanced Formatting: On
lic .na

• HTML Expression:
ble r.p

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


<b>Rating:</b> &RATING.
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 145


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

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

a
as
5. Click Save.

h
. m)
Add the Products Page

ide .co
1.

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

is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne

3. Enter/select the following and click Next:


n - ha
no ard

Under Page Definition:


nd

• Page Number: 19
Na

• Name: Products
Under Data Source:
ir
m

• 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© 2024, Oracle University and/or its affiliates.

148
Click Next.
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

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© 2024, Oracle University and/or its affiliates.

defaults and click Next.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard

5. Under Create Faceted Search, select the following:


nd

• Select Grid
Na

• Title Column: PRODUCT_NAME


ir
m

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

• Click Create Page.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Developing Reports 149


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne

You now know how to create an application item, an application process, a Faceted Search page,
n - ha

and a Cards page. You may now proceed to the next practice.
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

150 Practice: Developing Reports


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

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
Reports
us ne
e @
th g
is m
Gu ail
ide .co
. m)
h as
a
Practice: Managing and
Customizing Interactive
Practice 1: Customize an Interactive Report as a Developer
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

a
Downloads

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

h
. m)
application from here and import it into your workspace. To run the app, follow the
steps described in the Get Started with Oracle APEX and Using SQL

ide .co
Workshop workshops.

Gu ail
is m
th g
e @
Tasks

us ne
Customize an Interactive Report as a Developerto dha
se ar

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

users. First, view the Interactive Report in page designer. In the Developer Toolbar,
lic .na

click Edit Page.


ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na

b. In the report, ensure that you have selected 1. Primary Report in the report toolbar.
ble r.p

Click the edit icon (pencil) for any row.


ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

to the report.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p

3. The current pagination type of the interactive report is Row Ranges X to Y. Assume you
ra i
fe am

want to always show your end users the total number of rows in the report as part of the
pagination display. In the Developer Toolbar, click Edit Page.
ns (s
tra ne

a. Under Rendering, navigate to the Projects interactive report and select Attributes in
n - ha

the Property Editor.


no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Ranges X to Y of Z.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
4. to dha
You want to customize the display of the Search Bar. End users should be able to select the
display of the desired number of rows per page.
se ar
en nd

In the Property Editor, locate Search Bar under Attributes. Perform the following:
lic .na

• Enable Rows Per Page Selector.


ble r.p

• Enter 10 for Maximum Rows Per Page.


ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd

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

the Property Editor, navigate to Download. Select the Excel and PDF download formats.
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
9. Select Actions > Report > Save Report.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m

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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
11. This report is now saved as a public report for all users and is available in the Reports drop-

is m
down list.

th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd

12. Click Actions > Download.


Na

13. Notice that the Excel and PDF formats are available. Click the Close icon.
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

158 Practice: Managing and Customizing Interactive Reports


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s

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


tra ne
n - ha

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

may now proceed to the next practice.


nd
Na
ir
m
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© 2024, 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.

Tasks

a
as
Customize an Interactive Report as an End User

h
. m)
1. To start, run the Sample Reporting application. Click App Builder.

ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p

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


ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

160 Practice: Managing and Customizing Interactive Reports


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

a
h as
. m)
ide .co
Gu ail
is m
3. In the navigation menu or in the Cards Region, click Interactive Report.

th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard

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

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

the following steps:


ir
m

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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
b.

e @
The Select Columns dialog box appears. The columns on the right are displayed, and

us ne
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
to dha
the left arrow (<).
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
5. Next, let's say you want to filter the report results. First, you want to filter the report to
to dha
display rows that meet the criteria Cost <= 2000. Within these filtered results, you then
create another filter to display rows with Project is Bug Tracker. Perform the following
se ar

steps:
en nd
lic .na

a. Click Actions and select Filter.


ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
c. Next, add the second filter on the Project column. Click the Actions menu and
select Filter.
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
e. Notice that two filters are applied. Fewer rows are displayed because only the rows that
se ar

meet both the filter criteria are displayed. You can remove each filter by clicking the
en nd

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


lic .na

Click the Remove Filter icon next to both the filters.


ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a. Select Actions > Data > Sort.

a
h as
. m)
ide .co
Gu ail
is m
th g
b. Remove the existing sort columns under Column by using the select list in rows 2 and

e @
3 of Column to restore the value to the default, Select Column.

us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
d. The report is now sorted in Descending order of Cost.

us ne
7. to dha
Create an aggregation against the Available Budget column. You want to display the sum
of the Available Budget.
se ar
en nd

a. Select Actions > Data > Aggregate.


lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

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

a
h as
. m)
ide .co
c.

Gu ail
The aggregate function is applied on the column. Notice that the sum of Available

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

th g
page to view the sum.

e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am

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

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

a. Select Actions > Data > Compute.


n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
9. Create a control break on the Project column.

th g
e @
a. Select Actions > Format > Control Break.

us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

click Apply.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
c. The control break is now applied. Notice that the aggregation you created in a previous
to dha
step appears at the end of each control break.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar

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

Background Color, select Green and for Text Color, select Black. Under Highlight
lic .na

Condition, for Column, select Cost and for Operator, select <=. For Expression,
ble r.p

enter 500.
ra i
fe am

Click Apply.
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
11. Now, you want to control the number of rows to display on your Interactive Report page.

e @
us ne
a. Select Actions > Format > Rows Per Page > 5.
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha

b. Notice that Rows Per Page in your interactive report is now 1-5.
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
b.
to dha
In the Chart dialog box, select/enter the following:
se ar

• Chart Type: Bar


en nd

• Label: Project
lic .na

• Value: Cost
ble r.p

• Function: Average
ra i
fe am

Click Apply.
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Reports 175


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
c. The chart is created. Toggle between the Chart view and the Report view.
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir

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

a. Click View Report.

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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
c. In the Group By dialog box, enter/select the following:

Gu ail
• Group By Column: Project

is m
• Function: Sum

th g
e @
• Column: Budget

us ne
• Label: Total Budget to dha
• Format Mask: $5,324.10
se ar

Make sure you enable Sum and click Apply.


en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

icon for View Group By is also added.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
e. Click the X to the right of Edit Group By to remove the filter.

us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

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

a. Click Actions > Pivot.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
b. In the Pivot dialog box, enter/select the following:

to dha
Pivot Columns: Assigned To
se ar

• Row Columns: Project


en nd

• Functions: Sum
lic .na

• Column: Cost and Budget


ble r.p

• Label: Total Cost and Total Budget


ra i
fe am

• Sum: Yes
ns (s

Click Apply.
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Reports 179


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

180
c.
Sa

button.
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a
The Pivot report is displayed, and a View Pivot icon is created next to the Actions

Practice: Managing and Customizing Interactive Reports


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

a. Select Actions > Report > Save Report.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
b. Under Name, enter My Private Report and click Apply.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir

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

can view the default primary report. You want to reset the Primary Report back to the
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
b. To restore the primary report to its default settings, select Actions > Report > Reset.

is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne

c. In the Reset dialog box, click Apply.


n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
17. You want to download the customized report as a CSV.

e @
us ne
a. Select Actions > Download.
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
c. The report is now downloaded as a CSV.

Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s

You now know how to manage and customize an interactive report as an end user. You may
now proceed to the next practice.
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

184 Practice: Managing and Customizing Interactive Reports


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

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
Grids
to dha
us ne
e @
th g
is m
Gu ail
ide .co
. m)
h as
a
Practice: Managing and
Customizing Interactive
Practice 1: Customize an Interactive Grid as a Developer
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

a
Downloads

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

h
. m)
application from here and import it into your workspace. To run the app, follow the
steps described in Practice-01 and Practice-02.

ide .co
Gu ail
is m
Tasks

th g
e @
us ne
Manage and Customize the Interactive Grid as a Developer
to dha
This practice uses the Demo Projects application. In this practice, you customize
se ar

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

the report downloadable formats that should be available to end users. You also enable end
lic .na

users to save the report as Public interactive grids and convert a read-only interactive grid to
ble r.p

an editable interactive grid.


ra i
fe am

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


ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

186 Practice: Managing and Customizing Interactive Grids


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd

2. In the navigation menu, click Project Tasks. You want to customize the display of this
lic .na

interactive grid for your end users. In the Developer Toolbar, click Edit Page 4.
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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

a
Group.

h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am

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


ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar

f. Then, select the StartDate and EndDate columns. In the Property Editor,
en nd

under Layout, for Group, select Schedule.


lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
h. The interactive grid now displays column groups.

th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m

4. Rearrange the columns in the interactive grid. You want to ensure the Project Breakdown,
Sa

Schedule, and Project Financing column groups display in order, followed by Status and
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
6. You want to ensure that end users are able to save Public interactive grids. You also want
to dha
to exclude HTML from the download formats available to end users.
se ar

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


en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Click Save Public Report to enable the feature. Under Download, deselect
the HTML check box.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha

7. Convert this read-only interactive grid into an editable interactive grid. Then, reset the
no ard

pagination as Page type, displaying the total row count.


nd

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


Na
ir
m
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© 2024, Oracle University and/or its affiliates.

to turn on the feature. Also, under Pagination, for Type, select Page.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Interactive Grid > Column Groups, select Schedule, Project Breakdown, and Project
Financing, right-click and select Delete.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i

9. Assume you want to display the ID column and exclude the ID column from DML
fe am

operations. Under Page Rendering > Project Tasks interactive grid, expand Columns and
ns (s

select ID.
tra ne
n - ha

Navigate to Identification and set Type to Display Only. Then, navigate to Source and
no ard

click Query Only to enable it. Click Save and Run Page.
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing and Customizing Interactive Grids 195


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

a
h as
. m)
ide .co
You now know how to manage and customize the interactive grid as a developer. You

Gu ail
may now proceed to the next practice.

is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
as
Tasks

h
. m)
Customize an Interactive Grid as an End User

ide .co
In this practice, you use and customize the display of your interactive grid. You also edit an

Gu ail
editable interactive grid.

is m
th g
e @
1. Notice that the interactive grid is now editable. You see the Edit, Save, and Add Row

us ne
buttons. Also, the pagination type that you have set is displayed. Perform a non-case-
to dha
sensitive search for server on the entire interactive grid.
se ar

To do this, enter server in the search bar text area and click Go.
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Now, in the search bar, click the magnifying glass and select the Task Name column.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar

3. Enter server in the text area and click Go. Notice that the search is now restricted
en nd

to the Task Name column.


lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

1. Click the field and replace the existing value with 500.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
5. The changes are not saved yet. Click the Save button. The changes are now saved.
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

the row for the project with ID 2 and select Single Row View.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na

7. You are now in the single row view of the project with ID 2. Replace the existing value for
ble r.p

Budget with 9000 and click Save. Then, click Report View.
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Break.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
9. In the Control Break dialog box, for Column, enter Project and click Save.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Actions > Format > Highlight.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
11. In the Highlight dialog box, enter/select the following:
se ar

• Name: Project Costing greater than 800


en nd

• Background Color: Yellow


lic .na

• Text Color: Red


ble r.p

• Column: Cost
ra i
fe am

• Operator: greater than or equals


ns (s

• Value: 800
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

202 Practice: Managing and Customizing Interactive Grids


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

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s

Practice: Managing and Customizing Interactive Grids


fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g

12. Notice the rows with a cost greater than 800 are highlighted.
is m
Gu ail
ide .co
. m)
h as
a

203
13. You want to save the changes made to the interactive grid. Select Actions > Report > Save
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

As.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
14. In the Report – Save As dialog box, for Type, select Private. Under Name, enter My Private
se ar

Report. Click Save.


en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na

16. You want to make few more customizations and save the interactive grid as another Private
report. You do not want the Start Date, End Date, and Assigned To columns to be
ble r.p

displayed in the report. Click the Start Date column header and then click Hide.
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
18. In the Chart dialog box, select:

e @
us ne
• Type: Bar
• Label: Project to dha
• Value: Cost
se ar
en nd

• Aggregation: Sum
lic .na
ble r.p

Click Save.
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Select Actions > Report > Save As.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
20. In the Report – Save As dialog box, for Type, select Private. Under Name, enter My
Custom Report. Then, click Save. to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
22. You want to download the report. Select Actions > Download.

th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

click Download.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd

24. The report is now downloaded as an Excel file.


lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

210
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Managing and Customizing Interactive Grids


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

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @
th g
is m
Gu ail
ide .co
. m)
Practice: Creating

h as
a
Application Page Controls
Practice 1: Add Items and Buttons to a Page
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

Customers will be able to:

a
as
• Review items in the shopping cart

h
• Edit the quantity of the items

. m)
• Remove an item

ide .co
• Clear the shopping cart

Gu ail
• Proceed to checkout

is m
th g
e @
Downloads

us ne
• Did you miss out on trying the previous practices? Don’t worry! You can download the
to dha
application from here and import it into your workspace. To run the app, follow the
se ar

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

Workshop workshops.
lic .na
ble r.p

Tasks
ra i
fe am
ns (s

Add Items and Buttons to a Page


tra ne

1. Navigate to the App Builder. Then click Online Shopping Application.


n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

212 Practice: Creating Application Page Controls


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

2.
Sa
m
ir
Na
nd
no ard

Practice: Creating Application Page Controls


n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na Under Page Icons, select Shopping Cart.
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

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© 2024, Oracle University and/or its affiliates.

a second region of content.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
4. In the Property Editor, for Title, enter Order Information.
to dha
5. Navigate to the Order Information (left pane) region.
se ar

6. Right-click the Order Information region and select Create Page Item.
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

• Name: P16_CUSTOMER_EMAIL
• Type: Text Field
• Label: Email Address
• Value Required: Off

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne

8. Create four items as follows:


n - ha
no ard

Table 1: Create Application Page Controls | Practice 1: Add Items and Buttons to a Page
nd
Na

Value
Name Type Label Template
Required
ir
m
Sa

Optional -
P16_CUSTOMER_FULLNAME Text Field Full Name Off
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© 2024, 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:
select STORES.STORE_NAME as STORE_NAME,

a
as
STORES.STORE_ID as STORE_ID

h
from STORES

. m)
ide .co
• Set Display Extra Values to Off

Gu ail
• Null Display Value: Enter - Select a Store -

is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

216 Practice: Creating Application Page Controls


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
9. Navigate to the Order Information (left pane) region.

us ne
to dha
10. Right-click the Order Information region and select Create Button.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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

Proceed to
Proceed Create Text On

a
Checkout

h as
Clear Shopping fa-cart-

. m)
Clear Change Text with Icon Off
Cart empty

ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

218 Practice: Creating Application Page Controls


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p

Under Server-side Condition:


ra i
fe am

Table 3: Create Application Page Controls | Practice 1: Add Items and Buttons to a Page
ns (s
tra ne

Button Name Type Item


n - ha
no ard

Proceed Item is NOT NULL SHOPPING_CART_ITEMS


nd

Clear Item is NOT NULL SHOPPING_CART_ITEMS


Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating Application Page Controls 219


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

a
h as
. m)
ide .co
Gu ail
is m
Add Items and Buttons

th g
e @
us ne
In this task, you will create four page items:
• PRODUCT_ID: To get the product ID to dha
• ACTION: To identify the action (Add/Edit/Delete) made for the customer
se ar
en nd

• QUANTITY: To permit customers to select the number of items to add or edit in the
lic .na

shopping cart
• SHOPPING_CART_ITEMS: To get the total number of items in the shopping cart after
ble r.p

an action is made
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na

2. Drag a Static Content region and drop it into the Dialog Footer.
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

• Title: Buttons Bar


• Template: Buttons Container

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am

4. In the Rendering tree (left pane), navigate to the Buttons Bar region.
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na

6. Create four items in the Property Editor:


ble r.p
ra i
fe am

Table 4: Create Application Page Controls | Practice 1: Add Items and Buttons to a Page
ns (s

Name Type Label Template


tra ne
n - ha

P17_ACTION Hidden
no ard
nd

P17_PRODUCT_ID Hidden
Na

P17_SHOPPING_CART_ITEMS Hidden
ir
m
Sa

P17_QUANTITY Select List Quantity Required

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© 2024, Oracle University and/or its affiliates.

to a Page

Display Value Return Value

1 1

2 2

a
as
3 3

h
. m)
4 4

ide .co
Gu ail
5 5

is m
th g
e @
• Click OK.

us ne
• Set Display Extra Values to Off. to dha
• Set Display Null Value to Off.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s

9. Create three buttons as follows:


tra ne
n - ha

Table 6: Create Application Page Controls | Practice 1: Add Items and Buttons to a Page
no ard

Button
nd

Name Label Button Position Hot


Template
Na
ir

Add Add to Cart Next Text On


m
Sa

Update
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

10. For the Delete button, apply the following changes:


• 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


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

next practice.
Sa
m
Click Save.

ir
Na
nd
no ard

Practice: Creating Application Page Controls


n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a
You now know how to create page items and page buttons. You may now proceed to the

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

228
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Creating Application Page Controls


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

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @
th g
is m
Gu ail
and Validations

ide .co
application using

. m)
h as
a
Computations, Processes
Practice: Enhancing your
Practice 1: Add Branches, Validations, and Processes to the
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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
enable customers to:

a
• Review the items in the shopping cart

h as
• Edit the quantity of the items

. m)
• Remove an item

ide .co
• Clear the shopping cart

Gu ail
• Proceed to checkout

is m
th g
In this lab, you will:

e @
us ne
• Create Validations, Processes, and Branches to manage the Shopping Cart
Downloads to dha
• Did you miss out on trying the previous labs? Don’t worry! You can download the
se ar

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

steps described in Get Started with Oracle APEX and Using SQL Workshop workshops.
lic .na

Tasks
ble r.p
ra i
fe am

Create Validations on the Page


ns (s

1. Navigate to the App Builder. Then, click Online Shopping Application.


tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
3. In the Rendering tree (left pane), click the Processing tab.

is m
th g
4. Over Validating, right-click Create Validation.

e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i

Table 1: Enhance your application using Computations, Processes, and Validations | Lab 1:
fe am

Add Branches, Validations, and Processes to the Shopping Cart Page


ns (s
tra ne

Name Type (under Validation) Item


n - ha
no ard

a.Validate Name Item is NOT NULL P16_CUSTOMER_FULLNAME


nd

b.Validate Email Item is NOT NULL P16_CUSTOMER_EMAIL


Na
ir

c.Validate Store Item is NOT NULL P16_STORE


m
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© 2024, 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

Inline with Field and in


Please enter your name P16_CUSTOMER_FULLNAME

a
Notification

h as
Please enter your email Inline with Field and in

. m)
P16_CUSTOMER_EMAIL
address Notification

ide .co
Gu ail
Inline with Field and in
Please select a store P16_STORE

is m
Notification

th g
e @
Because these validations only apply when the user proceeds to checkout, let's create that

us ne
condition. Under Server-side Conditions, set the following:
to dha
Table 3: Enhance your application using Computations, Processes, and Validations | Lab 1: Add
se ar
en nd

Branches, Validations, and Processes to the Shopping Cart Page


lic .na

Name When Button Pressed


ble r.p
ra i
fe am

Validate Name Proceed


ns (s

Validate Email Proceed


tra ne
n - ha

Validate Store Proceed


no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

1. On the Processing tab (left pane), right-click Processing and click Create Process.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar

2. In the Property Editor, enter the following:


en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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 =>
:P16_ORDER_ID,

a
p_customer_id =>

as
:P16_CUSTOMER_ID);

h
END;

. m)
ide .co
• For Success Message, enter Order successfully created: &P16_ORDER_ID.

Gu ail
• Under Server-side Condition, for When Button Pressed, select Proceed.

is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha

Add Process to Clear the Shopping Cart


no ard

1. On the Processing tab (left pane), right-click Processing and click Create Process.
nd
Na

2. Create a second process to clear the shopping cart. In the Property Editor and enter the
ir

following:
m

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© 2024, Oracle University and/or its affiliates.

BEGIN
manage_orders.clear_cart;
END;

• Under Server-side Condition, for When Button Pressed, select Clear.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

1. On the Processing tab (left pane), right-click After Processing and click Create Branch.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
2. In the Property Editor, enter the following: to dha
• For Name - enter Go to Orders.
se ar

• Navigate to Target attribute and click No Link Defined.


en nd

 For Type - select Page in this application.


lic .na

 For Page - enter 16.


ble r.p

 For Set Items - enter:


ra i
fe am

Table 4: Enhance your application using Computations, Processes, and


ns (s

Validations | Lab 1: Add Branches, Validations, and Processes to the Shopping Cart
tra ne

Page
n - ha
no ard

Name Value
nd

P16_ORDER &P16_ORDER_ID.
Na
ir

For Clear Cache - enter 16.


m


Sa

 Click OK.

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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
3. Create a second branch when the user clears the shopping cart. Right-click After
se ar
en nd

Processing and click Create Branch.


lic .na

4. In the Property Editor, enter the following:


ble r.p

• For Name - enter Go to Products.


ra i
fe am

• Navigate to the Target attribute and click No Link Defined.


ns (s

 For Type - select Page in this application.


tra ne

 For Page - enter 1.


n - ha

 For Clear Cache - enter 1.


no ard

 Click OK.
nd

• Under Server-side condition, for When Button Pressed, select Clear.


Na
ir
m

You now know how to add validations, processes, and branches to your APEX page. You may
Sa

now proceed to the next practice.

Copyright © 2023, Oracle and/or its affiliates.

238 Practice: Enhancing your application using Computations, Processes and Validations
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @
th g
is m
Gu ail
ide .co
Dynamic Actions

. m)
h as
a
Practice: Creating and using
Practice 1: Add Dynamic Actions, Computations, and
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

Processes

Overview

This practice is a collection of nine tasks. After completing this lab, your application will enable
customers to:

a
• Create dynamic actions to manage the Shopping Cart

h as
• Review the product details

. m)
• Add, edit, or remove the product from the shopping cart

ide .co
• Read the customer reviews

Gu ail
is m
th g
In this lab, you will:

e @
us ne
• Create dynamic actions for the Shopping Carts Page
• to dha
Add Computations and Page Process to the Add to Cart page
se ar
en nd

Downloads
lic .na

• Did you miss out on trying the previous labs? Don’t worry! You can download the
ble r.p

application from here and import it into your workspace. To run the app, please run the
ra i
fe am

steps described in Get Started with Oracle APEX, Using SQL Workshop, and Enhancing
your application using Computations, Processes, and Validations workshops.
ns (s
tra ne
n - ha

Tasks
no ard

Add Dynamic Actions


nd
Na

In this task, you will create dynamic actions to:


ir

• Update the badge and icon shown in the navigation bar after the customer has
m
Sa

added/edited/removed a product from the shopping cart


• 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© 2024, Oracle University and/or its affiliates.

1.

Sa
m
ir
Na
nd
no ard
n - ha

Practice: Creating and using Dynamic Actions


tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Go to Shopping Cart page (Page No 16) in the page designer.

Gu ail
ide .co
. m)
h as
a

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

2.

242
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
Navigate to the Dynamic Actions tab (left pane).

se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Creating and using Dynamic Actions


3. Right-click Dialog Closed and select Create Dynamic Action.
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
4. In the Property Editor, enter the following:

th g
e @
• Under Identification section:

us ne
 For Name - enter Update Shopping Cart Header.
to dha
• Under When section:
se ar

 For Event - select Dialog Closed.


en nd

 For Selection Type - select Region.


lic .na

 For Region - select Shopping Cart.


ble r.p

• Under Client-side Condition:


ra i
fe am

 For Type - select JavaScript expression.


ns (s

 For JavaScript Expression, enter the following:


tra ne

parseInt(this.data.P17_SHOPPING_CART_ITEMS) > 0
n - ha
no ard
nd
Na
ir
m
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© 2024, 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:
// Update Badge Text

a
apex.jQuery(".js-shopping-cart-item .t-Button-

as
badge").text(this.data.P17_SHOPPING_CART_ITEMS);

h
. m)
// Update Icon

ide .co
apex.jQuery(".js-shopping-cart-item .t-Icon").removeClass('fa-

Gu ail
cart-empty').addClass('fa-cart-full');

is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Update Shopping Cart Header Dynamic Action, right-click True, and select Create
TRUE Action

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
7. In the Property Editor, enter the following: to dha
• Under Identification section:
se ar

• For Name - enter Refresh Shopping Cart region


en nd
lic .na

• For Action - select Refresh.


• Under Affected Elements section:
ble r.p


ra i

For Selection Type - select Region.


fe am

• For Region - select Shopping Cart.


ns (s
tra ne

8. Create an opposite action. In the Dynamic Actions tab (left pane), navigate to the Execute
n - ha

JavaScript Code action.


no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
10. Navigate to the Execute JavaScript Code action under the False heading.
• Under Identification section:
to dha
For Action - select Execute JavaScript Code.
se ar


en nd

• Under Settings section:


lic .na

 For Code - enter the following JavaScript Code:


ble r.p

// Update Badge Text


ra i

apex.jQuery(".js-shopping-cart-item .t-Button-badge").text('');
fe am
ns (s

// Update Icon
tra ne

apex.jQuery(".js-shopping-cart-item .t-Icon").removeClass('fa-
cart-full').addClass('fa-cart-empty');
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

246 Practice: Creating and using Dynamic Actions


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

a
h as
. m)
ide .co
Gu ail
11. Create a second action. In the Dynamic Actions tab (left pane), navigate to False under the

is m
Update Shopping Cart Header dynamic action.

th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard

12. In the Property Editor, enter the following:


nd

• Under Identification section:


Na

• For Name - enter Refresh Shopping Cart region


ir
m

• For Action - select Refresh.


Sa

• Under Affected Elements section:


• 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© 2024, 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:

a
img {

as
width: 150px;

h
height: 150px;

. m)
}

ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s

3. Click Save.
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

1. Navigate to Page Finder and click File symbol. Then in the popup Page Finder, select
page 17.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
2. In the Rendering tree (left pane), expand the Pre-Rendering.
to dha
Right-click Before Regions and select Create Computation.
se ar

3.
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m

4. In the Property Editor, enter the following:


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© 2024, Oracle University and/or its affiliates.

RETURN manage_orders.product_exists(p_product =>


:P17_PRODUCT_ID);

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd

Create a Process to Add Products to the Shopping Cart


lic .na

In this Task, you call the manage_orders.add_product procedure that will add a product
ble r.p

temporarily to the APEX collection.


ra i
fe am

1. In the Rendering tree (left pane), navigate to the Processing tab.


ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
3. In the Property Editor, enter the following:

is m
• For Name - enter Add product.

th g
e @
• For Type - select Execute Code.

us ne
• For PL/SQL Code - enter the following code:
to dha
BEGIN
IF manage_orders.product_exists(p_product =>
se ar

:P17_PRODUCT_ID) = 0 THEN
en nd

manage_orders.add_product (p_product =>


lic .na

:P17_PRODUCT_ID,
ble r.p

p_quantity => :P17_QUANTITY);


END IF;
ra i
fe am

:P17_ACTION := 'ADD';
ns (s

END;
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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

In this Task, you call the manage_orders.remove_product and manage_orders.add_product

a
procedures to remove a product from the shopping cart and add it again with the updated

as
quantity.

h
. m)
1. In the Processing tab, right-click Processing and select Create Process.

ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i

2.
fe am

In the Property Editor, enter the following:


• For Name - enter Edit product.
ns (s
tra ne

• For Type - select Execute Code.


n - ha

• For PL/SQL Code - enter the following PL/SQL code:


no ard

BEGIN
IF manage_orders.product_exists(p_product =>
nd

:P17_PRODUCT_ID) > 0 THEN


Na

manage_orders.remove_product(p_product =>
:P17_PRODUCT_ID);
ir
m

manage_orders.add_product (p_product =>


Sa

:P17_PRODUCT_ID,
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© 2024, Oracle University and/or its affiliates.


Click Save.
Sa
m
ir
Na
nd
no ard
n - ha

Practice: Creating and using Dynamic Actions


tra ne
ns (s
fe am
ra i
ble r.p
Under Server-side Condition section:

lic .na
For When Button Pressed, select Edit.

en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

253
Create a Process to Delete Products from the Shopping Cart
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
In the Property Editor, enter the following:
• For Name - enter Delete product.
to dha
• For Type - select Execute Code.
se ar
en nd

• For PL/SQL Code - enter the following PL/SQL code:


lic .na

BEGIN
IF manage_orders.product_exists(p_product =>
ble r.p

:P17_PRODUCT_ID) > 0 THEN


ra i
fe am

manage_orders.remove_product(p_product =>
:P17_PRODUCT_ID);
ns (s

END IF;
tra ne

:P17_ACTION := 'DELETE';
n - ha

END;
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

254 Practice: Creating and using Dynamic Actions


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
• to dha
Under the Server-side Condition section:
 For When Button Pressed, select Delete.
se ar
en nd

Click Save.
lic .na

Create a Process to Calculate the Shopping Cart Items


ble r.p
ra i

In this task, you call the manage_orders.get_quantity to get the total number of products in the
fe am

shopping cart.
ns (s
tra ne

1. In the Processing tab, right-click Processing and select Create Process.


n - ha

2. In the Property Editor, enter the following:


no ard

• For Name - enter Calculate Shopping Cart Items.


nd

• For Type - select Execute Code.


Na

• For PL/SQL Code - enter the following PL/SQL code:


ir
m

BEGIN
Sa

:P17_SHOPPING_CART_ITEMS := manage_orders.get_quantity;
END;

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating and using Dynamic Actions 255


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

a
h as
. m)
ide .co
Click Save.

Gu ail
is m
Create a Process to Close the Modal Page

th g
e @
us ne
After the customer has taken an action (add/edit/delete) regarding the product, the modal page
will close and the shopping process continues.to dha
se ar

1. In the Processing tab, right-click Processing and click Create Process.


en nd
lic .na

2. In the Property Editor, enter the following:


• Under the Identification section:
ble r.p

For Name - enter Close Dialog.


ra i


fe am

 For Type - select Close Dialog.


ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

256 Practice: Creating and using Dynamic Actions


.
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd

Enhance the Modal Page


lic .na
ble r.p

1. Navigate to the Rendering tab (left pane).


ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na

4. Click Save.
ble r.p

You now know how to customize and enhance the APEX page. You may now proceed to the
ra i
fe am

next practice.
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

258 Practice: Creating and using Dynamic Actions


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

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
Filters
to dha
us ne
e @
th g
is m
Gu ail
ide .co
. m)
h as
a
Practice: Managing Cards,
Faceted Search, and Smart
Practice 1: Improve Smart Filters Page
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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

Downloads

a
as
• Did you miss out on trying the previous labs? Don’t worry! You can download the

h
application from here and import it into your workspace. To run the app, please run

. m)
the steps described in Get Started with Oracle APEX and Using SQL

ide .co
Workshop workshops.

Gu ail
is m
th g
Task

e @
us ne
Enhance Smart Filters
to dha
In this Lab, you are going to customize the Smart Filters page in the Demo
se ar

Projects application. The Project Tasks Search page utilizes Smart Filters to display the
en nd

records.
lic .na
ble r.p

1. Navigate to the App Builder. Then, click the Demo Projects application.
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
3. Navigate to the Project Tasks Search page and click Page 8 in the Developer

Gu ail
is m
toolbar. Note that your page number might be different.

th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard

4. Now, Update P8_PROJECT, Change type to Radio Group and enable the Client-Side
nd

Filtering attribute.
Na

In the Rendering tab, select the P8_PROJECT filter (if not already selected). In the Property
ir

Editor, under the Identification change type to Radio Group, then find List Entries and
m
Sa

enable Client-Side Filtering. Enabling this option renders a search field above the list
entries.

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Cards, Faceted Search, and Smart Filters 261


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am

5. Click Save and Run Page in the upper-right corner. If prompted, enter your workspace
username and password and click Sign In. The revised page appears.
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
1. View the smart filters page in Page Designer. In the Rendering tab, right-click Filters and

as
select Create Filter.

h
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne

2. Select the new filter and edit the following filter attributes in the Property Editor:
n - ha

• Under Identification:
no ard

• For Name, enter P8_TASK_NAME.


nd

• For Type, select Checkbox Group.


Na
ir
m
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© 2024, Oracle University and/or its affiliates.

• For Type, select Distinct Values.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar

3. Click Save and Run Page in the upper-right corner. If prompted, enter your
en nd

workspace username and password and click Sign In. The revised page appears.
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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
customizing the cards.

a
as
Please note that customer can quickly identify the products that already have been added to the

h
shopping cart.

. m)
ide .co
In this practice, you will:

Gu ail
• Improve both Faceted Search and Cards region

is m
• Add Dynamic Actions to the page

th g
e @
Downloads

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

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

Workshop workshops.
lic .na

Task: Navigate to Products Page.


ble r.p

1. From the runtime application, navigate to the Products page in Page Designer.
ra i
fe am

Given that you run this app from the APEX App Builder, you will find the Developer
ns (s

Toolbar at the bottom of the screen. {Note: End users who log directly into the app
tra ne

will not see this toolbar.}


n - ha

In the Developer Toolbar click Page 19.


no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Cards, Faceted Search, and Smart Filters 265


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

a
h as
. m)
ide .co
Gu ail
is m
Alternatively, you can also navigate back to the APEX App Builder tab in your browser

th g
e @
manually by selecting the appropriate browser tab or window.

us ne
Once in the App Builder, click 19 - Products.
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir

You should now be in Page Designer with Page 19: Products loaded.
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
Enhance the Faceted Search
to dha
1. In the Rendering tree (left pane), navigate to Search.
se ar
en nd

2. In the Property Editor (right pane), click Attributes and do the following:
lic .na

• For Total Row Count Label - enter Total Products.


ble r.p

• For Show Charts - select No.


ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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",
"UNIT_PRICE",

a
"PRODUCT_DETAILS",

as
"PRODUCT_IMAGE",

h
"IMAGE_MIME_TYPE",

. m)
"IMAGE_FILENAME",

ide .co
"IMAGE_CHARSET",

Gu ail
"IMAGE_LAST_UPDATED",

is m
"COLOR_ID",

th g
(

e @
SELECT l1."COLOR"

us ne
FROM "COLOR_LOOKUP" l1
to dha
WHERE l1."COLOR_ID" = m."COLOR_ID") "COLOR_ID_L$1",
se ar

"DEPARTMENT_ID",
en nd

(
lic .na

SELECT l2."DEPARTMENT"
FROM "DEPARTMENT_LOOKUP" l2
ble r.p

WHERE l2."DEPARTMENT_ID" = m."DEPARTMENT_ID")


ra i
fe am

"DEPARTMENT_ID_L$2",
"CLOTHING_ID",
ns (s

(
tra ne

SELECT l3."CLOTHING"
n - ha

FROM "CLOTHING_LOOKUP" l3
no ard

WHERE l3."CLOTHING_ID" = m."CLOTHING_ID")


"CLOTHING_ID_L$3",
nd

b.brand
Na

FROM "PRODUCTS" m,
json_table (m.product_details, '$' columns ( brand
ir
m

varchar2(4000) path '$.brand') ) b


Sa

Copyright © 2023, Oracle and/or its affiliates.

268 Practice: Managing Cards, Faceted Search, and Smart Filters


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

a
h as
. m)
ide .co
Gu ail
Under Appearance section:

is m
• Click Template Options. For Style - select Style A.

th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd

• Click OK
Na

2. Click Attributes and apply the following changes:


ir
m

• Click Attributes and apply the following changes:


Sa

• For Layout - select Grid.


• 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© 2024, 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>

a
• Under Media section:

as

h
For Source - select BLOB Column.

. m)
• For BLOB Column - select PRODUCT_IMAGE.

ide .co
• For Position - select First.

Gu ail
• For Appearance - select Widescreen.

is m
• For Sizing - select Fit.

th g
e @
• Under Card section:

us ne
• For Primary Key Column 1 - select PRODUCT_ID
to dha
• Click Save.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

270 Practice: Managing Cards, Faceted Search, and Smart Filters


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

a
h as
. m)
ide .co
Create Actions

Gu ail
is m
Customers need a way to shop the products, so in this task you will add an action to allow

th g
customers to learn more about the product.

e @
us ne
1. Navigate to Search Results (left pane). to dha
2. On Actions, right-click Create Action.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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
Faceted Search and Cards regions

a
as
Name Value

h
. m)
P17_PRODUCT_ID &PRODUCT_ID.

ide .co
Gu ail
• For Clear Cache, enter 18.

is m
• Click OK.

th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na

Add Dynamic Actions


ir
m

In this task, you will create two dynamic actions:


Sa

• To show a success message when a product is added/edited/removed from the


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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
2. Right-click Dialog Closed and select Create Dynamic Action.
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m

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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar

4. Navigate to Refresh Action.


en nd

• Under Identification section:


lic .na

• For Action - select Execute JavaScript Code.


ble r.p

• Under Settings section:


ra i
fe am

• For Code - enter the following JavaScript Code:


ns (s

var productAction = this.data.P17_ACTION,


tra ne

productQuantity = this.data.P17_QUANTITY,
n - ha

productCard$ = apex.jQuery("#message_" +
this.data.P17_PRODUCT_ID);
no ard
nd

if (productAction === 'ADD') {


Na

productCard$.text("Added " + productQuantity + " to cart!");


} else if (productAction === 'EDIT') {
ir
m

productCard$.text("Updated quantity to " + productQuantity +


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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
5. Create a second dynamic action. Right-click Dialog Closed and select Create Dynamic

is m
Action.

th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd

6. In the Property Editor, enter the following:


Na

• Under Identification section:


• For Name - enter Update Shopping Cart Header.
ir
m

• 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© 2024, Oracle University and/or its affiliates.

parseInt(this.data.P18_SHOPPING_CART_ITEMS) > 0

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
7. Navigate to the Refresh action.
to dha
• Navigate to the Refresh action.
se ar

• For Action - select Execute JavaScript Code.


en nd

• Under Settings section:


lic .na

• For Code - enter the following JavaScript Code:


ble r.p

// Update Badge Text


ra i
fe am

apex.jQuery(".js-shopping-cart-item .t-Button-
badge").text(this.data.P17_SHOPPING_CART_ITEMS);
ns (s
tra ne

// Update Icon
n - ha

apex.jQuery(".js-shopping-cart-item .t-Icon").removeClass('fa-
cart-empty').addClass('fa-cart-full');
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

dynamic action.

9. Right-click Execute JavaScript Code and select Create Opposite Action.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd

10. Navigate to the Execute JavaScript Code action.


lic .na

• Under the Identification section:


ble r.p

• For Action - select Execute JavaScript Code.


ra i

• Under the Settings section:


fe am

• For Code - enter the following JavaScript Code:


ns (s

// Update Badge Text


tra ne

apex.jQuery(".js-shopping-cart-item .t-Button-badge").text('');
n - ha
no ard

// Update Icon
nd

apex.jQuery(".js-shopping-cart-item .t-Icon").removeClass('fa-
cart-full').addClass('fa-cart-empty');
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Cards, Faceted Search, and Smart Filters 277


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

a
h as
. m)
ide .co
Gu ail
is m
11. Click Save and Run Page.

th g
e @
us ne
Run the Products Page
to dha
1. After running products page, your page will look like the following image:
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir

You now know how to enhance faceted search and cards region. You may now proceed to the
m

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© 2024, Oracle University and/or its affiliates.

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar Forms
to dha
us ne
e @
th g
is m
Gu ail
ide .co
. m)
h as
a
Practice: Creating and Using
Practice 1: Create and Customize Forms
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

Downloads

a
as
• Did you miss out on trying the previous labs? Don’t worry! You can download the

h
application from here and import it into your workspace. To run the app, please run

. m)
the steps described in Get Started with Oracle APEX and Using SQL Workshop

ide .co
workshops.

Gu ail
is m
th g
Create a Product Details Form

e @
us ne
1. Navigate to the App Builder. Then, click Online Shopping Application.
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
3. For Create a Page: Select Page Type - select Component and then select Form.

e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Under Data Source


• For Table/View Name, Select PRODUCTS. Click Next.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s

5. Under Primary key, for Primary Key Column1 - Ensure the PRODUCT_ID is selected as the
tra ne

primary key. Then click Create Page.


n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

282 Practice: Creating and Using Forms


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
Link a Report to a Form
to dha
1. Navigate to the App Builder. Then, click Online Shopping Application and run
se ar

Application. From the runtime application, navigate to the Manage Products page in
en nd

Page Designer.
lic .na

Given that you run this app from the APEX App Builder, you will find the Developer
ble r.p

Toolbar at the bottom of the screen. {Note: End users who log directly into the app
ra i
fe am

will not see this toolbar.}


ns (s
tra ne

In the Developer Toolbar, click Page 14.


n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating and Using Forms 283


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
2. In the Rendering tree (left pane), navigate to Products.
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir

3. In the Property Editor (right pane), click Attributes and do the following:
m
Sa

• Under Link:
• 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© 2024, Oracle University and/or its affiliates.

Name Value

P21_PRODUCT_ID #PRODUCT_ID#

• For Clear Cache, enter 21.


• Click OK.

a
Click Save.

h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p

4. Click Save and then reload the Manage Products page in the runtime
ra i
fe am

environment.
ns (s
tra ne

5. Now, In the Manage Products page, click Pencil Icon on the first row. Verify the Product
n - ha

Details model dialog page.


no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating and Using Forms 285


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

286
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Creating and Using Forms


Enhance the Form
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
2. Items can readily be moved using drag-and-drop within Layout. If required, you can also
se ar

drag new components such as regions, items, and buttons into the Layout pane from the
en nd

Gallery, located directly below it.


lic .na

In Page Designer, with Page 21 loaded, within Layout (middle pane), click P21_UNIT_PRICE and
ble r.p

continue to hold the mouse cursor down. Drag the item up and to the right, until it is directly
ra i
fe am

after P21_PRODUCT_NAME, and a dark yellow box is displayed. Release the mouse cursor to
ns (s

drop the item in the new location.


tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd

4. You now need to Focus on First item on Page. In Page Rendering (Left Pane), Select
lic .na

Page 21: Product Details. Then, In the Property Editor, Scroll down to Navigation and for
Cursor Focus, select First item on page. Then, click Save.
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

runtime environment. Click Edit to view the Form Page.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar

You now know how to create and customize a Form and then link the form to an Interactive
en nd

Report. You may now proceed to the next lab.


lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Creating and Using Forms 289


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

290
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Creating and Using Forms


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

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @
th g
Application

is m
Gu ail
ide .co
. m)
h
Navigation in your

as
a
Practice: Implementing
Practice 1: Improve Application
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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:


a
Set the following pages as public pages:

as
• Products

h
• Shopping Cart

. m)
• Order Information

ide .co
• Disable the Navigation Menu

Gu ail
• Enhance the Navigation Bar

is m
th g
e @
Downloads

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

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

Workshop workshops.
lic .na

Set Products page as the Home Page


ble r.p
ra i
fe am

In this lesson, you will set the products page as the Home page and then you will remove
the Home page under Navigation Menu.
ns (s
tra ne

1. Navigate to the App Builder. Then, click Online Shopping Application.


n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

292 Practice: Implementing Navigation in your Application


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

3.
2.

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
Now, select Shared Components.

Practice: Implementing Navigation in your Application


fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
Under User Interface, click User Interface Attributes.

us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

293
4. Now, under Attributes, select ≡ next to Home URL. Then, in the popup window, select 19
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

PRODUCTS and click Apply Changes.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p

5. Because you have changed the Home Page to Products page, you now need to
ra i
fe am

remove Home Page under Navigation Menu.


ns (s

Navigate to Shared Components.


tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

294 Practice: Implementing Navigation in your Application


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

6.
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s

Practice: Implementing Navigation in your Application


fe am
ra i
ble r.p
lic .na
Under Navigation, Select Navigation Menu.

en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

295
7. Select Navigation Menu, then select Pencil Icon before Home.
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s

8. In the List Entry page, Click the Delete button and then confirm delete by clicking OK.
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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

a
• Page 17: Add to Cart

h as
Follow these steps for the four listed pages:

. m)
ide .co
1. From the runtime application, navigate to the Products page.

Gu ail
In the Developer Toolbar click Edit Page 19.

is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
3. Click Save.
se ar
en nd

4. Navigate to Page Finder and select Page 15 from Dialog Page. Repeat steps 2-4.
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
Alternatively, if you are in the App Builder, click Shared Components.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
3. Click Navigation Menu.

e @
us ne
4. Set Display Navigation to Off. to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

5. Click Apply Changes.

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© 2024, Oracle University and/or its affiliates.

a
h as
2. Under Navigation, click Navigation Bar List.

. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s

3. Click Navigation Bar.


tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
5. In the List Entry page, enter the following and click Create List Entry.
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

• For Sequence - enter 1.


• 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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
8. Click the Pencil Icon before &APP_USER. to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

10. Click Apply Changes.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
11. Click Create Entry and enter the following:
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir

• For Sequence - enter 5.


m

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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
12. Click Create List Entry.

th g
e @
us ne
You now know how to set page as public and manage Navigation bar and Navigation menu. You
may now proceed to the next lab. to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Implementing Navigation in your Application 305


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

306
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Implementing Navigation in your Application


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

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @
th g
is m
Gu ail
Themes Styles

ide .co
. m)
h as
a
Practice: Using Themes and
Practice 1: Use Themes and Theme Styles
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

Downloads

a
as
• Did you miss out trying the previous labs? Don’t worry! You can download the

h
application from here and import it into your workspace. To run the app, please run

. m)
the steps described in Get Started with Oracle APEX and Using SQL

ide .co
Workshop workshops.

Gu ail
is m
th g
Use Themes and Theme Styles

e @
us ne
In this hands-on lab, you use the Theme Roller to save a Theme Style. Then, you enable end
to dha
users to apply this style while running the application.
se ar

1. Navigate to App Builder and then run the Online Shopping Application. In the
en nd

Developer Toolbar, click Customize and then select Theme Roller.


lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p

3. Under Theme, change the Select Theme to Redwood Light.


ra i
fe am

4. For Theme Attributes, enter the following:


ns (s

Under Redwood Options:


tra ne

• For Layout, select Floating.


n - ha

Under Appearance:
no ard

• For Header, select Dark.


nd

• For Body Header, select Dark.


Na

• For Body Background, select Dark.


ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Using Themes and Themes Styles 309


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

5.

310

Sa
m
ir
Click Save As.

Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a
In the Save As dialog, enter Redwood Light (Copy_1) for Style Name and click Save.

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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
7. In the application home page, click Shared Components. Under User Interface, click User

us ne
Interface Attributes.
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Using Themes and Themes Styles 311


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
8. Under Attributes, click Enable End Users to Choose Theme Style. Make sure this
se ar

attribute is set to On. Notice that the new Theme Style you saved is displayed under Theme
en nd

Style list. Click Apply Changes.


lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
10. Using the Customize dialog box, users can specify their Theme Style while running the

us ne
application. Select the Theme Style that you saved in step 3 above and click Apply
to dha
Changes.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

user < username >.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
You now know how to use the Theme Roller to save a new Theme Style. You may
to dha
now proceed to the next lab.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

314 Practice: Using Themes and Themes Styles


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

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @
th g
is m
Gu ail
ide .co
. m)
h
Practice: Extending

as
a
Application Capabilities
Practice 1: Manage Approvals Component
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

a
as
To apply for an expense, an employee logs in to the application and submits an expense request

h
filling in the Type (Accommodation/Conference/Internet/ Miscellaneous Expenses) and

. m)
Estimated Expenses. The task could be assigned to multiple potential owners, and then they

ide .co
can perform possible actions (Request information/Delegate/Release/Change Priority).

Gu ail
If the expense cost is more than 50000, then the Expense request, once approved by the

is m
immediate manager, will go to the next manager and so on, depending on the Expense amount.

th g
e @
This is a typical use case for a multi-level approval.

us ne
Also, Deadlines and Expiration are set for a task. The potential owner will get an Email before 5
to dha
mins of task expiration. If the task is not approved or rejected before the expiry, then the task
se ar

could be tagged as Expired.


en nd
lic .na

In this lab, you will:


• Obtain a free development environment
ble r.p
ra i

• Learn how to create a SQL Script


fe am

• Learn how to create a Task definition


ns (s

• Learn how to create a Page to submit Expense


tra ne

• Learn how to create a Unified Task List


n - ha
no ard

• Learn how to create Users


• Learn how to create an Email Template
nd

• Learn how to request Information/ Delegate/ Release


Na

• Learn how to set deadlines and expiration


ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
3. On the App Builder page, click Create.

Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p

4. Click New Application.


ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd

Create a SQL Script


lic .na
ble r.p

In this lab, you create database objects using SQL Script.


ra i
fe am

7. At the top of the application home page, click SQL Workshop and then SQL Scripts. The
ns (s

SQL Scripts page appears.


tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

9. In the Script Name, enter a name for the script - Employee details and Expense
status.

a
10. Enter the SQL statements.

h as
Copy the code below and paste it into the code editor:

. m)
CREATE TABLE "EMPLOYEE_DETAILS"

ide .co
("EMPNO" NUMBER GENERATED BY DEFAULT ON NULL

Gu ail
AS IDENTITY MINVALUE 1 MAXVALUE 9999999999999999999999999999

is m
INCREMENT BY 1 START WITH 8000 CACHE 20 NOORDER NOCYCLE NOKEEP

th g
NOT NULL ENABLE,

e @
"EMP_NAME" VARCHAR2(100),

us ne
"MGR" NUMBER(4,0),
to dha
CONSTRAINT "EMP_PK" PRIMARY KEY ("EMPNO"));
insert into EMPLOYEE_DETAILS(empno, emp_name, mgr) values (10,
se ar

'JOHN', 20);
en nd

insert into EMPLOYEE_DETAILS(empno, emp_name, mgr) values (20,


lic .na

'CLARA',30);
insert into EMPLOYEE_DETAILS(empno, emp_name, mgr) values (30,
ble r.p

'JANE', 40);
ra i
fe am

insert into EMPLOYEE_DETAILS(empno, emp_name, mgr) values (40,


'MATT', null);
ns (s

commit;
tra ne

CREATE TABLE "EMP_EXPENSE_REQUEST"


n - ha

("REQ_ID" NUMBER GENERATED BY DEFAULT ON NULL


no ard

AS IDENTITY MINVALUE 1 MAXVALUE 9999999999999999999999999999


INCREMENT BY 1 START WITH 8000 CACHE 20 NOORDER NOCYCLE NOKEEP
nd

NOT NULL ENABLE,


Na

"EMP_NO" VARCHAR2(10),
"EXPENSE_TYPE" VARCHAR2(100),
ir
m

"ESTIMATED_COST" NUMBER(8,0),
Sa

"UPDATED_BY" VARCHAR2(100),
"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© 2024, Oracle University and/or its affiliates.

320
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
2. Click Create Multiple Users.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne

3. Specify the following attributes:


n - ha

• For a List of Email Addresses: Enter [email protected], [email protected],


no ard

[email protected], [email protected]
nd

• For Usernames: Select Exclude @ domain as part of the username.


Na

• For password and Confirm Password: Enter a password of your wish.


ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 321


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

4.

322
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
Click Next and Create Valid Users.

fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Extending Application Capabilities


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir

Create a Task Definition


m
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© 2024, Oracle University and/or its affiliates.

1. In the App Builder, navigate to the Expense Tracker application and select Shared
Components.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
2. Under Workflows and Automations, select Task Definitions.
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd

3. Click Create.
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha

5. Click Create.
no ard

6. Under the Settings Section:


nd

• For Task details Page Number - Click the Create Task Details Page button, then
Na

click OK.
ir

• For Actions Source - Select SQL Query.


m


Sa

For Actions SQL query - Copy the code below and paste it into the code editor:
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
7. Under Participants Section - Select Participants to assign additional people to the Task

is m
th g
Definition.

e @
• Click Add Row.

us ne
• For Participant Type - Select Potential Owner
to dha
• For Value Type - Select SQL Query
se ar

• For Value - Copy the code below and paste it into the code editor:
en nd

select EMP_NAME from employee_details where EMPNO =(select MGR


lic .na

from employee_details where EMPNO=(select EMPNO from


ble r.p

employee_details where EMP_NAME=:APP_USER))


ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
9. Under Parameters Section - Select Add Row and fill in the four parameter fields listed

. m)
below:

ide .co
Gu ail
Table 1: Extend Application Capabilities | Lab 1: Manage Approvals Component

is m
th g
Static ID Label Data Type

e @
us ne
ESTIMATED_COST Estimated Cost to dha String
se ar

EXPENSE_STATUS Expense Status String


en nd
lic .na

EXPENSE_TYPE Expense Type String


ble r.p

EXPENSE_TYPE Req Id String


ra i
fe am

Static ID Label Data Type


ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
Specify the following:

e @
• For Name - Enter CREATE_EXPENSE_REPORT_ENTRY.

us ne
• For Type - Select Execute Code. to dha
• On Event - Select Create.
se ar

• For Code: Copy the code below and paste it into the code editor:
en nd

declare
lic .na

l_req_id number;
ble r.p

begin
ra i
fe am

if :APP_USER = :EMP_NAME then --this is the original initiator


l_req_id := :APEX$TASK_ID;
ns (s

-- create a new record in the Employee Expense Request table


tra ne

EMP_EXPENSE_REQUEST
n - ha

insert into EMP_EXPENSE_REQUEST values


no ard

(to_number(l_req_id),
:EMPNO,
nd

:EXPENSE_TYPE,
Na

:ESTIMATED_COST,
'',
ir
m

'PENDING');
Sa

end if;
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am

11. To Add the next action, Click the Add Action button.
ns (s
tra ne

Specify the following:


n - ha

For Name - Enter NEXT_APPROVER_OR_UPDATE_STATUS.


no ard


• For Type - Select Execute Code.
nd
Na

• On Event - Select Complete.


• For Outcome : Select Approved.
ir
m

• For Code: Copy the code below and paste it into the code editor:
Sa

declare
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© 2024, 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;
if :ESTIMATED_COST < 50000 then -- the approval is complete

a
as
update EMP_EXPENSE_REQUEST set status = 'APPROVED',

h
updated_by=updated_by||'->'||:APP_USER

. m)
where req_id = l_request_id and emp_no=:APEX$TASK_PK;

ide .co
Gu ail
l_req_status := 'APPROVED';

is m
else -- the request needs to go through another level of

th g
Approval

e @
-- updated the request record with details of the current

us ne
approver in the chain of approvers
to dha
update EMP_EXPENSE_REQUEST set updated_by = updated_by||'-
>'||:APEX$TASK_OWNER
se ar

where req_id = l_request_id


en nd

and emp_no=:APEX$TASK_PK;
lic .na

-- create a new task assigned to the manager of the current


approver
ble r.p

l_task_id := apex_approval.create_task(
ra i
fe am

p_application_id => :APP_ID,


p_task_def_static_id => 'EXPENSE_REQUEST',
ns (s

p_initiator => :EMP_NAME, -- ensure initiator is the


tra ne

original requestor and not the current task owner


n - ha

p_parameters => apex_approval.t_task_parameters(


no ard

1 => apex_approval.t_task_parameter(static_id =>


'EXPENSE_TYPE', string_value => :EXPENSE_TYPE),
nd

2 => apex_approval.t_task_parameter(static_id =>


Na

'ESTIMATED_COST', string_value => :ESTIMATED_COST),


3 => apex_approval.t_task_parameter(static_id =>
ir

'REQ_ID', string_value => l_request_id),


m

4 => apex_approval.t_task_parameter(static_id =>


Sa

'STATUS', string_value => l_req_status)


),
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
12. Again, click the Add Actions button.
se ar
en nd

Specify the following:


lic .na

• For Name - Enter UPDATE_REQUEST_STATUS.


ble r.p

• For Type - Select Execute Code.


ra i
fe am

• On Event - Select Complete.


ns (s

• For Outcome - Select Rejected.


tra ne

• For Code: Copy the code below and paste it into the code editor:
n - ha

declare
no ard

l_mgr number;
l_task_id number;
nd

l_request_id number;
Na

l_req_status varchar2(10) := 'PENDING';


ir

begin
m

select mgr into l_mgr from employee_details where


Sa

emp_name=:APP_USER;
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Add a page to submit an Expense request.

1. Click Application ID, Application home page appears.

a
h as
. m)
2. Click Create Page. The Create a Page Wizard appears.

ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd

3. Select Blank page under component and click Next


lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 333


4. Specify Blank Page Attributes.
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

Under the Navigation section:

a
as
• For Use Breadcrumb - Select On.

h
• For Breadcrumb Parent Entry - Select Home(Page 1).

. m)
• For Use Navigation - Select On.

ide .co
• For Navigation Preference - Select Create a new Entry.

Gu ail
• For Icon - Enter fa-file-o.

is m
th g
e @
Click Create Page.

us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na

6. In the Property Editor, edit the appropriate attributes:


ble r.p
ra i
fe am

Under Identification section:


For Title: Enter New Expense Request.
ns (s


tra ne

• For Type: Select Form.


n - ha

Under Source section:


no ard

• For Type: Select SQL Query.


nd

• For SQL query: Copy the code below and paste it into the code editor:
Na

Select e.empno, e.emp_name, m.emp_name as mgr_name


from EMPLOYEE_DETAILS e , EMPLOYEE_DETAILS m
ir
m

where m.empno(+) = e.mgr


Sa

and e.empno = :P3_EMPNO;

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 335


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar

7. Now, right-click the region (New Expense Request) and select Create Page Item.
en nd

• For Name - Enter P3_EXPENSE_TYPE.


lic .na

• For Type – Select, Select List.


ble r.p

Under List of Values section:


ra i
fe am

• For Type - Select Static values.


ns (s

• For Static Values - Enter below list and click OK.


tra ne

Table 2: Extend Application Capabilities | Lab 1: Manage Approvals Component


n - ha
no ard

Display Value Return Value


nd

Internet/Broadband Charges Internet/Broadband Charges


Na
ir

Accommodation Accommodation
m
Sa

Conference Conference

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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
8. Right-click region (New Expense Request) and select Create Page Item.

us ne
• For Name - Enter P3_ESTIMATED_COST.
to dha
• For Type - Select Number Field.
se ar

9.
en nd

Select the P3_EMPNO page item and enable the primary key under the Source section and
Click Save to apply changes.
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

click Create Process.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
In the Property Editor, enter the following:
se ar

• For Name - Type Fetch Employee Details for User.


en nd

• For Type - Select Execute code.


lic .na

• For PL/SQL Code - Enter the following PL/SQL code:


ble r.p

select empno into :P3_EMPNO from employee_details where


ra i
fe am

emp_name=:APP_USER;
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

338 Practice: Extending Application Capabilities


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

Sa
m
ir
Na
nd
no ard

Practice: Extending Application Capabilities


n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

339
• For Sequence - Enter 5.
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd

11. Click Save.


lic .na

12. Now add a process on the Processing tab to submit a request. Right-click Processing and
ble r.p

select Create Process.


ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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
• For Success Message: Type Expense Request submitted successfully.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a. For Estimated Cost, enter the following:


• For Type - Select ITEM.
• For Value - Select P3_ESTIMATED_COST.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
b. to dha
For Expense Status, enter the following:
se ar

• For Type - Select Static Value.


en nd

• For Value - Type PENDING.


lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

• For Type - Select ITEM.


• For Value - Select P3_EXPENSE_TYPE.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
d. For Request ID, enter the following:

us ne
• For Type - Select NULL. to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na

14. Click Save


ir
m
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© 2024, Oracle University and/or its affiliates.

In the Property Editor, enter the following:

• For Button Name - Type SUBMIT_REQUEST.


• For Hot - Select On.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Under the Server-side Condition section:

• For When Button Pressed : Select SUBMIT_REQUEST.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
17. Click Save. to dha
Create Unified Task Lists
se ar
en nd

Add a Unified Task list page to see the submitted expense request list by a requestor and the
lic .na

Approval list approved or rejected by the approver.


ble r.p

1. Click Application ID on the right-above corner of the page designer. The Application
ra i
fe am

Home page appears.


ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 345


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

2.

346
Sa
m
ir

Click Create Page.


Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Extending Application Capabilities


3. Under Components, select Unified Task List and click Next.
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar

4. Specify the following page attributes:


en nd

• For Page Number - Type 4.


lic .na

• For Name - Type My Approvals.


ble r.p

• For Report Context - Select My Tasks.


ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am

5. To create another Unified Task list page, again, click Application ID on the right-above
ns (s

corner of the page designer. The Application Home page appears.


tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

348 Practice: Extending Application Capabilities


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

7.
6.

Sa
m
ir
Na
nd
no ard

Practice: Extending Application Capabilities


n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


Under Component, select Unified Task List and click Next.

th g
is m
Gu ail
Click the Create Page button. The Create a Page Wizard appears.

ide .co
. m)
h as
a

349
8. Specify the following page attributes:
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard

Create an Email Template


nd
Na

Add an Email Template to add for before expiry action in the task definition.
ir
m

To define an email template:


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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
3. On the Email Templates page, click Create Email Template. The Details page appears.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne

4. Under Identification:
n - ha

• For Template Name - Enter BEFORE EXPENSE EXPIRY EMAIL.


no ard

• For Email Subject - Copy and paste the below text:


nd
Na

Expense Request FOR #APEX_TASK_SUBJECT# Requires your review


ir
m
Sa

*Note: For substitution strings with the #STRINGNAME# format. You can pass in values
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© 2024, 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>

a
• For Plain Text Format - Copy the text below and paste it into Plain text format:

h as
. m)
Hello #APEX_TASK_OWNER#,
Please check your "My Approvals" inbox. The expense request for

ide .co
#EMP_NAME# requires your timely review manner.

Gu ail
Thanks for your kind attention to this matter.

is m
Need to make a change to your Approval? Manage your Approval

th g
here: #APPROVAL_URL#

e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

352 Practice: Extending Application Capabilities


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

a
h as
. m)
ide .co
Gu ail
is m
6. Click Create Email Template.

th g
e @
Update Table Employee Details

us ne
1.
to dha
Navigate to SQL Workshop and click SQL Commands.
se ar

2. Copy and paste the commands below into the Script Editor to update the Employee
en nd

Details Table and execute the command one by one.


lic .na
ble r.p

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
ra i
fe am

below.
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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');

a
Alter table "EMPLOYEE_DETAILS" add "HR_MGR" VARCHAR2(10);

h as
Update EMPLOYEE_DETAILS set HR_MGR = 'SOPHIE' where EMPNO in

. m)
(10,20);

ide .co
Update EMPLOYEE_DETAILS set HR_MGR = 'ROBIN' where EMPNO in

Gu ail
(30,40);

is m
th g
Note: You can also create the two Users, SOPHIE and ROBIN, using the Manage Users

e @
And Groups menu option under Workspace Administration as done in TASK 3.

us ne
to dha
3. Click Run.
se ar

Update Task Definition


en nd
lic .na

Add deadline and expiration events in actions for expense requests.


ble r.p

Navigate to App Builder and select Expense Tracker application. Click Shared Components >
ra i
fe am

Workflows and Automations > Task Definitions and select the Expense Request Task Definition.
ns (s
tra ne

1. Under the Deadline section:


n - ha

• For Due on type - Select interval.


no ard

• For Due on the interval - Type PT30M.


nd

• For Expiration Policy - Select Expire.


Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

354 Practice: Extending Application Capabilities


2. Select Expense Request.
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

Under the Actions section - click Add Actions.

Specify the following attributes:

• For Name - Enter BEFORE_EXPIRY.


• For Type - Select Send Email.

a
• On Event - Select Before Expire.

as
For Before Expire Interval - Enter PT25M.

h

. m)
• For Success Message - Enter Task will expire in 5 minutes.

ide .co
Under the Send Email Settings section:

Gu ail
is m
• For From - Enter the Email address of your wish.

th g
• For To - Enter the Email address of your wish.

e @
us ne
• For Email Template - Select BEFORE EXPENSE EXPIRY EMAIL.
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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

a
as
APEX_TASK_SUBJECT &APEX$TASK_SUBJECT.

h
. m)
APEX_TASK_OWNER &APEX$TASK_OWNER.

ide .co
EMP_NAME &EMP_NAME.

Gu ail
is m
th g
APPROVAL_URL Paste the Login URL of your Expense Tracker Application

e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir

4. Click Create to save an action.


m
Sa

5. To add Expire event, click Add Actions and specify the following attributes:
• 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© 2024, 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;

• Click Create to add action.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha

You now know how to manage Approval Components.


no ard

You may now proceed to the next lab.


nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Extending Application Capabilities 357


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

358
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Extending Application Capabilities


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

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @
th g
is m
Gu ail
ide .co
Application Data

. m)
h
Practice: Managing

as
a
Practice 1: Manage Application Data
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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

a
consume the REST Data Source we created. Then, you will synchronize the data from REST

as
Data Source to the Local Database table using REST Data Synchronization.

h
. m)
Enable Remote Database Schema to Oracle REST Data Services

ide .co
Before starting this lab, you need to provision a new APEX instance or Workspace.

Gu ail
is m
In this hands-on lab, you will log in to a new, remote APEX workspace, create a table, and then

th g
e @
register schema with ORDS.

us ne
1. Log in to the new workspace you created.
to dha
2. Under SQL Workshop, select SQL Commands.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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),
"MGR" NUMBER(4,0),

a
CONSTRAINT "EMP_1_PK" PRIMARY KEY ("EMPNO"))

as
insert into emp_1(empno, emp_name, mgr) values (10, 'JOHN', 30);

h
insert into emp_1(empno, emp_name, mgr) values (20, 'CLARA',30);

. m)
insert into emp_1(empno, emp_name, mgr) values (30, 'JANE', 40);

ide .co
insert into emp_1(empno, emp_name, mgr) values (40, 'MATT', null);

Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
5. Click the Register Schema with ORDS button.

is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne

6. In the next window, leave the attributes to default and then click Save Schema
n - ha

Attributes.
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Object button.

a
h as
. m)
ide .co
8. Under AutoREST Enable Object, select the following and click Create.

Gu ail
is m
Set Object Type to TABLE.

th g

e @
us ne
• Select EMP_1 for Object
to dha
• Copy the Full URL and paste it in your Note pad.
se ar
en nd

Then Click Apply.


lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 363


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

a
h as
. m)
ide .co
9. Now, please change the Copied URL and replace ords with pls/apex and Workspace

Gu ail
Name with your Actual Workspace name as shown below.

is m
Copied URL: https://apex.oracle.com/ords/wksp_apexhandsonlabs/emp34/

th g
Updated URL: https://apex.oracle.com/pls/apex/apex_handson_labs/emp_1/

e @
us ne
Create an Application and Integrate Application Data from REST Data Source
to dha
In this lab, you create a New Application and then consume the REST Data Source we created
se ar
en nd

in the previous task. Then, you will synchronize the Data from REST Data Source to the Local
Database table using REST Data Synchronization.
lic .na
ble r.p

1. Log in to the first workspace, where we have already created multiple applications.
ra i
fe am

2. Select App Builder under Workspace Home Page.


ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

364 Practice: Managing Application Data


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

4.
3.

Sa
m
ir
Na
nd

Practice: Managing Application Data


no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
Under Create an Application, select New Application.

us ne
Now click the Create button to create a new application.

e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

365
5. Enter the following and click Create Application.
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

• For Name - Enter Leave Request Approval.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar

6. Navigate to Shared Components and then Select REST Data Sources.


en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

366 Practice: Managing Application Data


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

7.
Sa
m
ir
Na
nd

Practice: Managing Application Data


no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
Under REST Data Sources, click the Create button.

to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

367
8. Under Create REST Data Source - Method, leave the settings to default and select Next.
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
9. Under Create REST Data Source, enter the following and click Next.

us ne
• For REST Data Source Type - select Oracle REST Data Services.
to dha
• For Name - Enter Employee Details API.
se ar

• For URL Endpoint - Enter the URI we copied in Task 1.


en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

then click Next.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
11. For Authentication, set Authentication Required to No. Click Discover.

us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
Synchronize Data from REST Data Sources to a Local Table

us ne
to dha
In this lab, you will synchronize data from the REST Data source you created in Task 2 to a
Local table.
se ar
en nd

The Data Synchronization feature enables developers to automatically sync the contents of a
lic .na

local table with the data from an external REST service. Basically, APEX invokes the REST Service
ble r.p

defined in the REST Data Source, downloads all data, and synchronizes it to a local table.
ra i
fe am

1. Now that you have created a REST Data Source, Under REST Data Sources, select No
ns (s

under the Synchronized column for Employee Details API.


tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

4. Under Table Status, click Create Table. The table EMP_2 is now ready for synchronization.

a
Notice the message The synchronization table exists and matches the Data Profile.

h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p

5. You will define a synchronization schedule now. In the Synchronization Schedule field,
ra i
fe am

you can use the Database Scheduler calendaring syntax to define repeating
synchronization schedules, such as "every Tuesday and Friday at 4:00 p.m." or "the second
ns (s

Wednesday of every month." This calendaring syntax can be provided manually. Click the
tra ne

Schedule Builder button next to Synchronization Schedule.


n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

and enter 10 for Interval. Then, click Set Execution Interval.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
7. to dha
You are now ready to test the data synchronization. Click Save and Run.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard

8. You can see that data synchronization is triggered.


nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 373


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

374
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Managing Application Data


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

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @
th g
is m
Gu ail
ide .co
. m)
h
in your Application

as
a
Practice: Implement Security
Practice 1: Create Authentication and Authorization Schemes
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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
(Authorization).

a
as
Estimated Time: 20 minutes

h
. m)
Downloads

ide .co
• Did you miss out on trying the previous labs? Don’t worry! You can download the

Gu ail
application from here and import it into your workspace. To run the app, please run

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

th g
Workshop workshops.

e @
us ne
Implement Social Sign In(Facebook) Authentication in Online Shopping Cart Application.
to dha
In this hands-on lab, you create a Social Sign-in authentication scheme to enable Facebook
se ar

Authentication. You test the authentication scheme.


en nd
lic .na

1. Log in to Facebook’s developer console. Login to the Meta for Developers using
your Facebook Credentials and then select My Apps.
ble r.p
ra i
fe am
ns (s

Note: If you are logging in to the Facebook developer console for the first time, you
tra ne

must follow the below process before navigating to My Apps


n - ha
no ard

• A new user must first click the Get Started link to Create a Facebook for
nd

Developers account.
Na

• This then brings you to a welcome screen that gives you the option to Continue.
Click Continue.
ir
m

• Review your email and agree or not to the marketing-related communication


Sa

from Facebook.
• 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© 2024, Oracle University and/or its affiliates.

Sa
m
ir
2. Click Create App.

Na
nd

Practice: Managing Application Data


no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
3. Under Select an app type, Select Business and then click Next.

. m)
h as
a

377
4. Now, Under Provide Basic Information, enter the following and click Create App.
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

• For Display Name, enter APEX Authentication


• For App contact email, enter Your email address.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
5. You will now verify your Facebook account by Re-entering your password.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 379


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

380
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
7. In the Left Navigation Menu, click on Add Product.

to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Managing Application Data


8. Under Add products to your app, select Set up in Facebook Login card.
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
9. Navigate to Settings under Facebook Login in the navigation menu. You have to
enable Client OAuth Login and
to dha
add https://apex.oracle.com/pls/apex/apex_authentication.callback (If you are
se ar

using apex.oracle.com) Valid OAuth Redirect URIs. Then click on Save Changes.
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
11. Under Workspace Utilities, Select Web Credentials.

us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd

12. Click Create.


Na
ir
m
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© 2024, 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.
• For Client Secret or Password and Verify Client Secret or Password, Enter

a
the App Secret you copied in Step 6.

h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
15. Click Shared Components.

th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne

16. Under Security, Select Authentication Schemes.


n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
18. Under Create Authentication Scheme Page, leave the settings to default and click Next.

. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard

19. In the Authentication Scheme enter the following and click Create
Authentication Scheme. Under Name:
nd
Na

• For Name, Enter FB Authentication.


ir

• For Scheme Type, select Social Sign-In.


m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s

20. Notice that a new Authentication Scheme you created is displayed as FB Authentication
tra ne

- Current.
n - ha
no ard
nd
Na
ir
m
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


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

Sa
m
ir
Na
nd

Practice: Managing Application Data


no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
22. In the User Interface, click Administration.

lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
23. Now, log in to the application using your Facebook Credentials.

Gu ail
ide .co
. m)
h as
a

387
24. You are now logged in to the Online Shopping Application. Check the user name on the
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

top right of the Navigation Bar.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
Creating and Using an Authorization Scheme

us ne
to dha
In this task, you create an Authorization Scheme to ensure only people entered as Team
Members can log into the Online Shopping Application. You apply the authorization
se ar

scheme to the application properties.


en nd

1. Navigate to App Builder and select Online Shopping Application.


lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
3. Under Shared Components > Security, click Application Access Control.

Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i

4. Under Roles, Select Add Role.


fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a. For Name, Enter Administrator


b. For Static Identifier, select ADMINISTRATOR

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
7. In the User Assignment Page, enter the following and click Create Assignment.
se ar
en nd

a. For User Name, Enter AUTHORIZED USER.


lic .na

b. For Application Role, Check ADMINISTRATOR to Yes


ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 391


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

392
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p

9. Under Authorization Scheme, Click Create.


lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a
8. Navigate back to Shared Components and then select Authorization Schemes.

Practice: Managing Application Data


10. For Create Authorization Scheme, Leave the settings to default and then click Next.
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
11. In the Details section of Create Authorization Scheme, enter the following and click Create
Authorization Scheme.
se ar
en nd

a. For Name, Enter Admin.


lic .na

b. For Scheme Type, Select Is In Role or Group.


ble r.p

c. For Type, select Application Role


ra i
fe am

d. For Name(s), Select Administrator.


ns (s

e. For Identify error message displayed, enter You are not Authorized to
tra ne

view this.
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 393


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

394
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a
12. Navigate to Shared Components and then under Security, Select Security Attributes.

Practice: Managing Application Data


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

a
as
13. In the Edit Security Attributes Page, under Authorization,

h
select Admin for Authorization Scheme. Click Apply Changes.

. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd

14. Navigate to the runtime environment (tab or window). Click Sign Out in the
Na

navigation bar (top right).


ir
m

15. Run the application by navigating to Online Shopping Application and click Run.
Sa

In the User Interface, click Administration.

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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m

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© 2024, Oracle University and/or its affiliates.

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @
th g
is m
Gu ail
ide .co
. m)
h as
a
Pages to your Application
Practice: Adding Additional
Practice 1: Adding Additional Pages to Your Application
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

Downloads

a
as
• Did you miss out on trying the previous labs? Don’t worry! You can download the

h
application from here and import it into your workspace. To run the app, please run

. m)
the steps described in Get Started with Oracle APEX and Using SQL Workshop

ide .co
workshops.

Gu ail
Create a Calendar

is m
th g
e @
1. Navigate to App Builder and in the Home Page, click Demo Projects.

us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

398 Practice: Adding Additional Pages to your Application


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

3.
2.

Sa
m
ir
Na
nd
no ard

Select Calendar page type.


n - ha
tra ne
ns (s

Practice: Adding Additional Pages to your Application


fe am
ra i
ble r.p
lic .na
en nd
In the application home page, click Create Page.

se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

399
4. In the Create Calendar page, enter the following and click Next:
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

Under Page Definition:


• For Name, Enter Calendar.
Under Data Source:
• For Table / View Name, select DEMO_PROJECTS.
Under Navigation:

a
• Set Breadcrumb and Navigation to Yes.

h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na

6. Click Save and Run Page. Log in to the application with your credentials.
ble r.p
ra i
fe am

7. In the Developer Toolbar, click Edit Page.


ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
9. In the Template Options dialog box, input the following:
to dha
• Header - select Hidden but accessible.
se ar

• Style - select Remove UI Decoration.


en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
2. Select the Form page type.

us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

Under Data Source:

a
as
• For Table / View Name, select DEMO_PROJECTS.

h
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

• For Primary Key Column 1, select ID (Number).

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p

Customize the Calendar Page


ra i
fe am

In this lab, you will link the form page you created in Task 2 with the Calendar page.
ns (s
tra ne

1. Navigate to Calendar in the runtime environment and then click Page.


n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
3. In the Link Builder – Create Link dialog box, select 9 for Page, and enter 9 for Clear Cache.
to dha
Click OK.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.
• Clear Cache - enter 9.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard

6. You can enable calendar drag and drop by using the component attribute Drag and Drop.
nd

Your SQL query must select a primary key column, and you must have set the Primary
Na

Key Column calendar attribute. Then enter the PL/SQL code to update the event row in
ir

the database in the Drag and Drop PL/SQL Code attribute. That PL/SQL code typically
m
Sa

performs a SQL update on the database table - the bind variables:


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© 2024, 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'),
end_date = to_date(:APEX$NEW_END_DATE,'YYYYMMDDHH24MISS')

a
where ID = :APEX$PK_VALUE;

as
end;

h
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

the Developer Toolbar, click Application< n >

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
Create and Customize a Tree Page to dha
In this hands-on lab, you create the Employee tree by first creating a blank page and then
se ar

adding a Tree region.


en nd
lic .na

1. First, create a blank page in the Demo Projects application. In the application home page,
ble r.p

click Create Page.


ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Adding Additional Pages to your Application 409


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

3.
2.

410
Sa
m
ir
Na
Select Blank Page.

nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
Enter Tree Page for Name and then click Create Page.
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

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© 2024, Oracle University and/or its affiliates.

and select Create Region.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar

5. In the property editor, enter the following:


en nd
lic .na

Under Identification:
For Name, enter Tree.
ble r.p


ra i

• For Type, select Tree.


fe am

Under Source:
ns (s
tra ne

• For Type, select SQL Query.


n - ha

• For SQL Query, copy the following code and paste it:
no ard

select case when connect_by_isleaf = 1 then 0


when level = 1 then 1
nd

else -1
Na

end as status,
level,
ir
m

"ENAME" as title,
Sa

null as icon,
"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© 2024, Oracle University and/or its affiliates.

6.

412
button.
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a
In the page designer, navigate to Appearance and then click the Template Options

Practice: Adding Additional Pages to your Application


7. In the Template Options dialog box:
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s

8. In the Property Editor, Select Attributes. Navigate to Settings and select / enter
tra ne

the following:
n - ha

• Node Label Column: TITLE


no ard

• Node Value Column: VALUE


nd

• Hierarchy: Not Computed


Na

• Node Status Column: STATUS


ir
m

• Hierarchy Level Column: LEVEL


Sa

• Tooltip: Database Column


• 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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na

9. The Tree Page is now displayed.


ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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.

Downloads

a
as
• Did you miss out on trying the previous labs? Don’t worry! You can download the

h
application from here and import it into your workspace. To run the app, please run

. m)
the steps described in Get Started with Oracle APEX and Using SQL Workshop

ide .co
workshops.

Gu ail
is m
th g
Create a Store Details Map Page and Add It to Desktop Navigation Bar

e @
us ne
1. Navigate to App Builder and in the Home Page, click Online Shopping Application.
to dha
2. In the application home page, click Create Page.
se ar
en nd

3. Select Map page type.


lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Under Page Definition:


• For Page Number, enter 20.
• For Name, enter Store Locations Map.

Under Data Source:


• For Table/View Name, select STORES.

a
as
Under Navigation:

h
. m)
• For Breadcrumb, set it to No.

ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd

5. For Create Map, enter the following and click Create Page. For Map Style, select Points.
Na

Under Map Attributes:


ir

• For Geometry column Type, select Two Numeric Columns.


m
Sa

• For Longitude Column, select LONGITUDE.

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© 2024, Oracle University and/or its affiliates.

• For Tooltip Column, select STORE_NAME.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i

6. The Store Locations Map should be visible to the Public. To set the page as Public, select
fe am

Page #: Store Locations Map in the Rendering tree. In the Property Editor, navigate to
ns (s

Security, and for Authentication, select Page is Public.


tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

App < n >.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
9. Navigate to Shared Components.

us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne

10. In the Shared Components page, under Navigation, select Navigation Bar List.
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

12. Click Create Entry.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
13. For List Entry, enter the following and click Create List Entry.

us ne
to dha
Under Entry:
se ar

• For List Entry Label, enter Store Locations Map.


en nd
lic .na

Under Target:
• For Page, select 20.
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

15. You can now see that Store Locations Map is now displayed in Navigation Bar.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p

You now know how to manage Map pages. You may now proceed to the next lab.
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

420 Practice: Adding Additional Pages to your Application


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

Sa
m
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @
th g
is m
Gu ail
ide .co
Practice: Migrate

. m)
h as
a
Between Environments
Application Development
Practice 1: Migrate Applications
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

a
Objectives

h as
In this lab, you will:

. m)
• Create Installation Scripts

ide .co
• Create Data Packages

Gu ail
is m
Export application with supporting Objects.

th g
Downloads

e @
us ne
• 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
to dha
the steps described in Get Started with Oracle APEX and Using SQL
Workshop workshops.
se ar
en nd

Create Installation Scripts, Data packages, and Export Applications.


lic .na
ble r.p

Before starting this lab, you need to provision a new APEX instance or Workspace.
ra i
fe am

In this hands-on lab, you will log in to a new, remote APEX workspace, create a table, and then
ns (s

register schema with ORDS.


tra ne

1. On the Workspace home page, click the App Builder icon.


n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

422 Practice: Managing Application Data


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

3.
2.

Sa
m
ir
Na
nd

Practice: Managing Application Data


no ard
n - ha
tra ne
ns (s
fe am
Select the Demo Projects application.

ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
Click Supporting Objects. The Supporting Objects page appears.

ide .co
. m)
h as
a

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

5.
4.

424
Sa
m

Click Create.
ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
Under Installation, Select Installation Scripts.

se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Managing Application Data


6. Select Create from Database Object under Create Script.
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd

7. Under Script Attributes, select the below options and click Next.
lic .na

a. For Name, Select Database Objects.


ble r.p
ra i
fe am

b. For Object Type, select Table**


ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 425


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd

8. Now set the following attributes and then click Next.


lic .na
ble r.p

a. For Table Options, Select the Checkbox.


ra i
fe am

b. For Object, Select and Move the


ns (s

tables DEMO_PROJECTS and EBA_DEMO_IR_EMP to the right side.


tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

426 Practice: Managing Application Data


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

Sa
m
ir
Na
nd

Practice: Managing Application Data


no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

427
9. You will now see the Scripts created. Click Create.
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p

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
ra i
fe am

your page.
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Sa
m
ir
Na
nd

Practice: Managing Application Data


no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha

12. For Create Script, accept the defaults and click Finish.
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

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

430
Sa
m
ir
Na
nd
no ard
n - ha

14. Select Export and click Next.


tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a
13. The Scripts are now Created. Navigate back to the application and Select Export/Import.

Practice: Managing Application Data


15. In the Export Application page, Under Export Preferences, select Yes and Install on
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

Import Automatically and Click Export.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na

16. You will now notice that the application is downloaded as fNNN.sql
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard

Import Application into the Target Workspace and Verify Database Objects.
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 431


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

1.

432
Sa
m
ir
Na
nd
no ard
n - ha
tra ne
Log in to the Target Workspace.

ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Managing Application Data


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

3.
2.

Sa
m
ir
Na
nd

Practice: Managing Application Data


no ard
n - ha
tra ne
ns (s

Under Import, click Drag and Drop.


fe am
ra i
ble r.p
Click App Builder and then select Import.

lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

433
4. Choose the file we exported in the previous lab from your Local System and then
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

click Next.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am

5. Under Install, Set Build Status to Run and Build Application. Leave the remaining
ns (s

settings to default and Click Install Application.


tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

434 Practice: Managing Application Data


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

6.
Sa
m
ir
Na
nd

Practice: Managing Application Data


no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a
For Supporting Objects, Set Install Supporting Objects to yes and then click Next.

435
7. Click Install.
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar

8. You will now see that Your application's supporting objects have been installed.
en nd

Click Edit Application to review the Database Objects.


lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd

10. Select DEMO_PROJECTS table and then click Data. Verify the Data in the
lic .na

table DEMO_PROJECTS.
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 437


Practice 2: Remote Deployment
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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
hosted instance apex.oracle.com. You should be using APEX Service or APEX on

a
Autonomous Database options for this lab.

h as
Objectives

. m)
In this lab, you will:

ide .co
Gu ail
• Export application with supporting Objects.

is m
Use Remote Deployment to deploy your Application.

th g
e @
Downloads

us ne
• Did you miss out on trying the previous labs? Don’t worry! You can download the
to dha
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
se ar

Workshop workshops.
en nd
lic .na

Import Sample Application


ble r.p

The ORDS feature, REST Enabled SQL is not available for apex.oracle.com users.
ra i
fe am

Therefore, you will not be able to perform this lab in the hosted instance
apex.oracle.com. You should be using APEX Service or APEX on Autonomous
ns (s

Database options for this lab.


tra ne
n - ha

In this Lab, You will install a Sample Application in a new workspace you created
no ard

either on APEX Service or APEX on Autonomous Database. Please follow the steps
in Get Started with Oracle APEX workshop to provision an instance or to create
nd

workspace on APEX Service or APEX on Autonomous Database.


Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

438 Practice: Managing Application Data


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

1.

Sa
m
ir
Na
nd

Practice: Managing Application Data


no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
Log in to the new Workspace you created.

lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

439
2. Once you Navigate to Gallery, Click Sample Apps.
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar

3. Now that you are in Sample Apps, search for apps by typing "Reporting" into the "Search
en nd

Apps" search box and navigate to Sample Reporting and click the Install Button.
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

440 Practice: Managing Application Data


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

4.

Sa
m
ir
Na
nd

Practice: Managing Application Data


no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
On the Install Application page, click the Install Application Button.

ide .co
. m)
h as
a

441
5. You can now see that the application is installed. Run the application by
Unauthorized reproduction or distribution prohibited. Copyright© 2024, Oracle University and/or its affiliates.

selecting Run Application.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am

6. Log in to the Sample Reporting application as an End User. Enter


ns (s

your Username and Password (Same as your Workspace credentials) and click Sign In.
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

442 Practice: Managing Application Data


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

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha

7. You now see the Sample Reporting application home page. In your Runtime environment
no ard

under Developer Toolbar, click Home to return to the home page of the APEX
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 443


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

8.

444
Sa
m
ir

Click App Builder.


Na
nd
no ard
development environment.

n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

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© 2024, Oracle University and/or its affiliates.

are displayed along with their icons and report format.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 445


Configure the Target System
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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.

a
1. Log in to your Target System.

h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
2. Navigate to SQL Workshop > RESTful Services.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha

3. Click Register Schema with ORDS.


no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

message that the schema has been successfully registered.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na

5. Navigate to SQL Workshop > Restful Services. Expand RESTful Data Services >
ble r.p

Modules > oracle.example.hr > empinfo/ GET. Copy the Full URL and paste it into
ra i

your Clipboard or Notepad.


fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
Sa

Copyright © 2023, Oracle and/or its affiliates.

Practice: Managing Application Data 447


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

6.

448
Sa
m
Click Sign Out.

ir
Na
nd
no ard
n - ha
tra ne
ns (s
fe am
ra i
ble r.p
lic .na
en nd
se ar
to dha
us ne
e @

Copyright © 2023, Oracle and/or its affiliates.


th g
is m
Gu ail
ide .co
. m)
h as
a

Practice: Managing Application Data


Remote Deployment
Unauthorized reproduction or distribution prohibited. Copyright© 2024, 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)

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Reporting.

a
h as
. m)
ide .co
Gu ail
3. Click Export / Import.

is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne

4. Select Remote Deployment and click Next.


n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

the Add Deployment Server ( + ) icon next to the Deployment Server select list.

a
h as
. m)
ide .co
Gu ail
6. Enter the base URL for the REST Enabled SQL Service defined for your deployment

is m
server (WS_APEXUAT in this example). The schema in your deployment server has

th g
e @
already been enabled for use with ORDS RESTful Data Services in prerequisites.

us ne
For Endpoint URL, paste the base URL copied from the deployment instance in the
to dha
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.
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

Type, and turn off the Store Credentials switch. Click Create.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
8. Now you see a message that REST Enabled SQL Service has been created. From the

us ne
Deployment Server select list, choose the one that you just created. Enter the values
to dha
for Client ID and Client Secret and click Next. In this example, you use Basic
se ar

Authentication. Therefore, enter the Database user name (deployment schema) for
en nd

Client ID and the corresponding password for Client Secret. Then, Click Next.
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, 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
Application option On so that you can preserve the application ID, and enable

a
this application for future overwrites.

as
After making the above selections, click Deploy.

h
. m)
ide .co
Gu ail
is m
th g
e @
us ne
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na
ir
m
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© 2024, Oracle University and/or its affiliates.

successfully deployed to the remote server.

a
h as
. m)
ide .co
Gu ail
is m
th g
e @
11. Log in to your remote APEX instance. Make sure that the application is available and with

us ne
the same application id as in the source system.
to dha
se ar
en nd
lic .na
ble r.p
ra i
fe am
ns (s
tra ne
n - ha
no ard
nd
Na

Summary
ir
m

You now know how to deploy your Application from Development to UAT.
Sa

Copyright © 2023, Oracle and/or its affiliates.

454 Practice: Managing Application Data

You might also like