Creating a Master Detail Form Using Oracle HTML DB
Creating a Master Detail Form Using Oracle
HTML DB
This tutorial shows you how to rapidly create a Master Detail Form
by using Oracle HTML DB.
Approximately 30 minutes
This tutorial will discuss the following topics:
Place the cursor over this icon to load and view all
the screenshots for this tutorial. (Caution: Because this action loads all screenshots
simultaneously, response time may be slow depending on your Internet connection.)
Note: Alternatively, you can place the cursor over
each individual icon in the following steps to load and view only the screenshot
associated with that step.
What Is Oracle HTML DB?
Oracle HTML DB provides a declarative development framework for creating
database-centric Web applications. Development is done using an online service.
Deployment is done by downloading a run-time module and your application and
running the application within your enterprise.
What Components Make Up Oracle HTML DB?
Oracle HTML DB contains three main components. You will use all three
components throughout this tutorial.
| Application Builder |
Using the Application Builder, you can build database-centric
interactive Web applications.
|
| SQL Workshop |
The SQL Workshop enables you
to run SQL statements and SQL scripts. |
| Data Workshop |
With the Data Workshop, you
can load data into and extract data from the database. |
Terminology
The following concepts are important to know when working
with Oracle HTML DB:
| Application |
An application is a collection of pages with branches
that connect them. Its attributes include the authentication method, default
UI templates, and authorization rules.
|
| Page |
A page is defined by how it is
rendered or displayed and by how it is processed. Processing refers to the
events and logic that occur when the page is submitted. Each page is rendered
dynamically at run time from metadata defined by the application developer.
How a page looks is controlled by page templates. |
| Region |
Content is displayed in regions,
which are logical subsections of a page. Each page can have any number of
regions of several different types. These types include: HTML text, SQL
Queries, PL/SQL-generated HTML, and charts. Each region is rendered using
a region template. Regions are positioned on the page using display points
defined in the page template. |
| Item |
Application items are used to
generate HTML form elements. The Applications engine manages the PL/SQL-generated
of the HTML, and you as the developer simply choose the item type. Applications
support more than 50 such types including date pickers, pop-up lists of
values, text areas with spell checking, and so on. The value of an item
is automatically stored into the application's session state, which can be referenced at any
point within the user's session.
|
Architecture
All applications are rendered in real time from data stored
in database tables. When you create or extend your application, no code is generated;
metadata is created or modified and stored in database tables. The applications-rendering
engine reads the metadata and displays the page accordingly.

All session states are also stored in the database. Each page
view results in a new database session, so when the applications engine is not
processing a page, no database resources are consumed (except for the storage
space used by table rows). The unique session identifier used to manage your
application's session state as the user runs the application from start to finish
is unrelated to the many individual database sessions created and run by the
run-time engine for each page view.
Applications that execute SQL or PL/SQL are parsed as the
"owner" of the application. When your workspace is provisioned, you
are given the right to parse as a specific schema. Thus all your Oracle database
rights and privileges are those of the schema you choose to parse as.
Back to Topic List
Before starting this tutorial, you should have:
Back to Topic List
To load the data for this tutorial from a spreadsheet, perform
the following steps:
| 1. |
To navigate to the Oracle HTML DB Login Page, enter the following URL in your browser:
http://<host name>:<port>/pls/htmldb/htmldb
|
| 2. |
To log in to Oracle HTML DB, enter the following details, and
click Login.
Workspace: obe
Username: obe
Password: obe

|
| 3. |
To create the table that the application will be based
on, click Data Workshop.

|
| 4. |
To create the table based on a spreadsheet, click Import
Spreadsheet Data.

|
| 5. |
Ensure that the import target (Import To) is set to
New table. For Import From, select the Upload file (comma separated
or tab delimited) option. Click Next >.

|
| 6. |
Click Browse.

|
| 7. |
Locate the tasks.txt file in your working
directory and click Open.

|
| 8. |
Because the data in the text file is tab delimited,
enter \t in the Separator field. Click Next >.

|
| 9. |
The Table Information page displays the columns in the
table and their formats, as well as the data to be inserted into the table
after the table is created. For Table Name, enter Tasks, and click
Next >.

|
| 10. |
Using the Primary Key page, you can add a system-generated
primary key to your table and populate that column with a new sequence.
Review the default values, and click Import Data.

|
| 11. |
After the table is created and the data is loaded, you
will be left on the Files page. You can see the file that you just uploaded
with 16 rows successfully uploaded. To view your new table, click the
SQL Workshop tab.

|
Back to Topic List
To create a master table on the Project column, perform the
following steps:
| 1. |
In the Database Browser section, click the Tables link.

|
| 2. |
Make sure OBE is selected from the list of schemas.

|
| 3. |
Ensure that OBE and TABLE are selected as values for
the schema and type, respectively. To view the table definition, scroll
down to the bottom of the Database Object Results table, and click the
Object Detail ( )
icon next to the TASKS table.

|
| 4. |
In the Tasks list on the right of the window, click the Create Lookup Table link.

|
| 5. |
To specify the column on which the master table is to
be created, select PROJECT - varchar2, and click Next >.

|
| 6. |
Enter the following values, and click Next >.
New Table Name: PROJECTS
New Sequence: PROJECT_SEQ

|
| 7. |
Click Finish.

|
| 8. |
To view the tables that are referenced by the TASKS
table, click the arrow to expand Foreign
Keys (Tables this table references) at the bottom of the page.

|
| 9. |
To see the definition of the new PROJECTS table, click PROJECTS in
the Parent Table column.

|
| 10. |
Notice that the new PROJECTS table contains a numeric
primary key along with the PROJECT column. Now you can create the Application that will use these tables you just created. Click Workspace OBE in the breadcrumbs.

|
Back to Topic List
To create the application framework and a few empty pages,
perform the following steps:
| 1. |
On the Oracle HTML DB home page, click Create Application
>.

|
| 2. |
Because you are going to create an application from scratch,
keep the default value of From Scratch for the Creation Method, and click
Next >.

|
| 3. |
For Name, enter Project Tasks Application. To
specify that the application will have two pages, select 1 from the Pages drop-down list. Click Next >.

|
| 4. |
Click No Tabs,
and click Next >.

|
| 5. |
Enter Home for the Page Name and click Next >.

|
| 7. |
Keep the default value of Theme 1 (red), and
click Next >.

|
| 8. |
Click Create Application.

|
| 9. |
Your application has been created. In the next topic, you will now create your Master Detail Form.

|
Back to Topic List
If there are very few tasks, it is all right if they are all
displayed together. However, when there are many tasks, it is better to see
the tasks sorted by Project. A Master Detail form enables you to do just this. To
add a Master Detail form, perform the following steps:
| 1. |
To create a new page, in the Application Builder page, click Create Page >.

|
| 2. |
Select the Page with Component option, and click
Next >.

|
| 3. |
To specify the component that is going to be added to
the page, select the Form option. Click Next >.

|
| 4. |
Select the Master Detail Form option, and click
Next >.

|
| 5. |
To specify the master table, select PROJECTS from the Table/View Name
drop-down list.

|
| 6. |
To select all the columns, click the Add All
icon ( ).

|
| 7. |
The Displayed Columns list lists the columns that will
be displayed in both the report and the master region. Click Next >.

|
| 8. |
To specify the detail table, select TASKS from the Table/View Name
drop-down list.

|
| 9. |
To select all the columns, click the Add All
icon ( ).

|
| 10. |
Click Next >.

|
| 11. |
To specify that the primary key source is an existing
sequence, select the Existing sequence option.

|
| 12. |
This results in a new Sequence selection list getting
displayed. From the Selection drop-down list, select PROJECT_SEQ
and click Next >.

This identifies how the primary key of PROJECTS will
be generated. The page created will allow for the creation of new Projects.
|
| 13. |
For the detail table primary key source, select the
Existing Sequence option.

|
| 14. |
This will make the Sequence selection list appear. From the
Selection drop-down list, select TASKS_SEQ and click Next >.

This identifies how the primary key of TASKS will be
generated. The page created will allow for the creation of new Tasks.
You notice a Finish button on this page. Most
wizards offer this "early out" to speed development. For this process,
there are several options left unselected that would be beneficial to
the application.
|
| 15. |
The Define Master page options determine whether the user
will be able to scroll through Projects and, if so, in what order. From
the Master Row Navigation Order drop-down list, select the PROJECT
option. You could use PROJECT_ID but because this is a system-generated
primary key that has no real meaning, it is better to scroll through alphabetically
by Project. The default is to include a master report. It would be nice
to have a report displaying all Projects as well the Master Detail, so
retain this default, and click Next >.

|
| 16. |
Using the Choose Layout page, you can specify whether you
want to view the details on the same page or on a separate page. The more
preferable method for this case is to view and edit the details of both
the Project and Tasks on the same page. So, leave the default value of
Edit detail as tabular form on same page, and click Next >.

|
| 17. |
With the Page Attributes page, you can identify the
page number, page title, and region title for the objects being created.
Keep the default values, and click Next >.

|
| 18. |
For Tab Options, select the Do not use tabs option. Click Next >.

|
| 19. |
The Master Detail Confirmation page displays all your choices and gives you the opportunity to use the < Previous button to modify any selections. Click Create.

|
| 20. |
To see the new page that displays all the projects, click the Run Page link.

|
| 21. |
You may receive a login screen. Enter obe/obe and click Login. The new Master page is displayed. Click the Edit ( )icon next to one of the rows.

|
| 22. |
This page allows a user to edit the details of the Project as well as the details of the Tasks associated with the Project. It also allows users to add new tasks to the current project. Because you included Master Row Navigation, the < Previous and Next > buttons are displayed. They will help to scroll through the projects. These buttons do not commit changes. If you make a change to the data, you need to apply the changes with the help of the Apply Changes button before scrolling.
In the detail region, you will see an Add Row button. This button saves any pending changes and then adds another row so that a new task can be added to the project. You should also have a Delete button. This button is used in conjunction with the check boxes to the left of each Task. The check box in the header row is used to select all the tasks. When you click the Delete button, any tasks that have been "checked" will be deleted. If you use this feature, you will notice that a deletion confirmation has been built in. This asks you to confirm your deletion before proceeding.

|
Back to Topic List
In this lesson, you learned how to:
Back to Topic List
Place
the cursor on this icon to hide all screenshots.
|