7 short labs in Database
GEIT 3341 DATABASE I LAB 2
GEIT 3341 Database I
Lab 2
Web Development with Apex
Due Date:
Submission Method: Project Link, Username & Password
Objective(s) Target CLO(s) Reference
How to develop a web database
application using Oracle Application
Express. In today’s lab, you will learn
how to develop a web application from
a spreadsheet.
5 Instructor Demo Any
book and/or tutorial
on Oracle
Application Express
Name ID Section
Instructions:
This is a hands-on step-by-step lab that will teach you how to
• Build your first app through uploading a Spreadsheet
• Improve the Search and Report pages
GEIT 3341 DATABASE I LAB 2
PART 1: Create an app from Spreadsheet You will build in this part a simple application based on a spreadsheet.
1. From your APEX workspace home page, click App Builder.
2. Click on Create a New App
GEIT 3341 DATABASE I LAB 2
4. Click the Copy and Paste option at the top and Select Project and Tasks from the sample
data set list and then click Next.
5. Set Table Name to PROJECT_TASKS and click Load Data.
7. Click Create App
3. Click From a File
6. Click on View Table
GEIT 3341 DATABASE I LAB 2
8. On the Create Application page, click Create App.
9. On the Create Application page, you can see all the listed pages. Click on Edit for more
details for a page.
10. Next to Feature, click Check all then click on Create Application
11. Now, you are redirected to the application's home page in the App Builder.
12. Click on Run Application to see how end users will see the app (a new web browser will
open). You have to enter your username and password you used to sign in into the APEX
workspace.
13. Explore the application by clicking on all the available buttons. (Click on Home button to
go back to the main page)
14. Click on Administration to review the options if needed
GEIT 3341 DATABASE I LAB 2
PART 2: Improve the Faceted Search This part gives you a first-hand experience with enhancing the application by improving the
faceted search page for better clarity and improved usability.
1. For the runtime application, click on Project Tasks Search
2. In the toolbar (bottom of the page), click Edit page 3 (Note - End users who log directly
into the app will not see this toolbar.)
3. Alternatively, you can also navigate back to the APEX App Builder tab in your browser
manually by selecting the appropriate browser tab or window. Once in the App Builder
click 3 - Project Tasks Search.
4. You will have this window (The page should consist of three panes).
GEIT 3341 DATABASE I LAB 2
5. Under Search (from the left pane), within Facets then P3_STATUS
6. Currently the Status facet is a series of checkboxes. However, it is unlikely that users will
want to select more than one at a time, so you will convert it to a radio group.
Continuing with P3_STATUS selected, within the Property Editor (right pane), for
Identification > Type, select Radio Group. Scroll down the properties in the Property
Editor, and for List Entries > Zero Count Entries select Show Last. Then click Save and
Run Page at the top right of your page
GEIT 3341 DATABASE I LAB 2
7. In the runtime environment, click one of the statuses. Review how the counts on the
other facets are updated based on your selection. Also notice how you can still select
one of the other statuses or click Clear, within the Status facet, to clear your selection
and again show all the counts for statuses.
8. Navigate back to the development environment (APEX App Builder) by using the edit link
in the Developer toolbar, or manually navigating to the appropriate browser tab in order
to to collapse the last three facets, making it easier to see all available facets. In the
Rendering tree (left pane), under Search, within Facets, click P3_ASSIGNED_TO, hold
down the Control key and then click P3_COST, such that three facets are selected.
In the Property Editor (right pane), within the filter at the top, enter collap, so that only
two attributes are displayed.
9. Click Save and Run Page
GEIT 3341 DATABASE I LAB 2
PART 3: Improve the Report In this part, you will gain an insight into the abilities of Interactive Reports, and learn how to
enhance a form page.
1. In the runtime environment, click Project Tasks Report.
2. Click the Project column heading, and then select Control Break.
3. To add a computational column, where a new column is defined based on a
computation against one more existing columns in the report click at the top of the
report, click Actions, select Data, and then select Compute.
4. Fill with the appropriate value (shown on the screenshot). The format mask should be
selected from the drop down menu and the computation expression should be filled by
clicking on the right columns and keypad. Click Apply to add a new column Budget V
Cost to your interactive report.
GEIT 3341 DATABASE I LAB 2
5. To add up the Budget versus Cost for each project, click Actions, select Data, and then
select Aggregate.
6. On Aggregate, for Column select Budget V Cost, then click Apply.
7. Even though you can see the total budget versus cost for each project, it would be much
easier to view the totals on a chart to get an overall picture of all of the projects. In the
report click Actions, select Chart.
8. Fill the Chart with the appropriate value (shown on the screenshot). Click Apply
9. If you want to sort all the records by Start Date and then End Date, Click View Reports
Icon, click Actions, select Data, and then select Sort. Fill it with the following values and
click Apply
GEIT 3341 DATABASE I LAB 2
10. As a developer you also have the ability to save the report as the Primary (default)
Report, or an Alternative Report. For this exercise you will save the report as a named
Alternative Report. In the report, click Actions, select Report, and then select Save
Report. On Save Report, for Save(Only displayed for developers) select As Default
Report Settings. In the Save Default Report dialog, select Alternative, for Name
enter Budget Review, and click Apply.
To go back to how the end user will see the report when they first access the report, at
the top of the report, select 1. Primary Report, and then click Reset.