Building a Websheet Application in Application Express 4.1

Building a Websheet Application in Application Express 4.1

This tutorial contains the following sections:

Purpose

Time to Complete

Overview

Prerequisites

Creating and Running a Websheet Application

Adding a Text Section to a Page

Adding Annotations to a Page

Displaying an Image

Creating a Data Grid

Creating a New Page as a Copy

Creating a Data Section Based on Data From a Data Grid

Creating a Chart Section Based on Data From a Data Grid

Creating a Section Navigation

Viewing a Page in Presentation Mode

Creating Page Navigation

Viewing Page History

Searching in a Websheet

Creating Oracle Application Express Users

Sharing Websheets Using an Access Control List

Summary

Resources

Purpose

This tutorial shows you how to build, use, and customize a Websheet Application in Oracle Application Express 4.1.

Note: Some screenshots in this tutorial may be slightly different depending on what browser you use.

Time to Complete

Approximately 60 minutes

Overview

Websheet applications are collections of pages that support wiki syntax. Each page can be organized into sections. Pages can also be organized into a hierarchy. Sections can be edited using a friendly editor.

Websheets provide the following functionality: Create and share content over the web using your browser.Organize web pages in a hierarchy and cross-link pages (using [[ pagename ]] syntax)Create and manage tabular data using an embedded feature called Data Grids.Create interactive reports using SQL on existing data structures in your database.Expose Data Grid and Report data within pages as a chart or a reportAnnotate pages with files, tags and notes. Associated images can be shown inline within page content (using [[image: filename]] syntax)Search page content (using search box in upper right hand)Manage who can login and once logged in, who can read, write or administer the application (authentication and authorization

This tutorial shows the developer how to create and customize a Websheet Application.

Page 1 of 42Building a Websheet Application Application Express 4.1

11/21/2011http://www.oracle.com/webfolder/technetwork/tutorials/obe/db/apex/r41/websheets/crwe...

Prerequisites

Before starting this tutorial, you should:

Install Oracle Database 11g.Install Oracle Application Express 4.1.Download and unzip the files.zip file into a working directory to use during this tutorial.

Creating and Running a Websheet Application

To create a Websheet Application log in to your Application Express workspace and perform the following steps:

1 . Click the down arrow in the Application Builder tab and select Websheet Applications.

2 . Click Create >.

3 . Select Websheet and click Next >.



4 . Enter Human Resources Management for Name and click Next > .

5 . Click Create.



6 . The websheet application is created successfully. Click Run to view the application.

7 . If Prompted, enter the credentials you used to log in to your Application Express workspace and click Login >.

8 . The Application is created with a default Home page. In the next sections, you will customize your application.



Adding a Text Section to a Page

In this topic, you will create a text section called Overview in the Home page. The text to enter in the section is available in the overview.txt file. Perform the following steps:

1 . Click the Create button and select New Section.

2 . Ensure Text is selected and click Next >.



3 . Enter Overview for Title. Open the overview.txt file and copy paste its contents to the Content field. Then, click Create Section.

4 . The Overview section is added to the Home page.



Adding Annotations to a Page

You can annotate any page in your application with files, tags, and notes.

Adding a File

Adding a Tag

Adding a Note

Adding a File

To add a file to the Home page, perform the following steps:

1 . Click the plus (+) icon in the Files section of the page.

2 . Click Choose File and browse for the resources.xls file in the files folder and click Open. Then, click Add File.



3 . The file is added to the page. Users can download and view the file by clicking the file name.

Adding a Tag

Tags enable you to organise your content for an easier search. To add a tag to a page, perform the following steps:

1 . Click the plus (+) icon in the Tags section of the page.

2 . Enter samples in the Tags field and click Add Tags.



3 . The tag is added to the page.

4 . At a later point in time if you want to view the tags you have added, click the View button and select Tags.

5 . The samples tag you had created is listed. Click the samples tag.

6 . The pages that are tagged with this samples tag are listed. Click the Home breadcrumb to return to the Home page.



Adding a Note

To add a note on a page, perform the following steps:

1 . Click the plus (+) icon in the Notes section of the page.

2 . Add New resources file has been added. in the Note field and click Add Note.

3 . The note is added to the page. You can click the pencil icon to edit the note.



Displaying an Image

You can include images in your pages by using the syntax [[IMAGE:<filename>]]. The image that you are referring to should be added to the files section of the page. To display an image in a page, perform the following section.

1 . Click the plus (+) icon in the Files section of the page.

2 . Click Choose File and locate the hr_logo image from the files folder. Then, click Add File.

3 . The hr_logo image is added to the page.

4 . Click the Edit button for the Overview section.



5 . To display the image in this section, enter [[IMAGE:hr_logo.jpeg]] under the existing text in the Content field and click Apply Changes.

6 . The image is displayed in the page under the Overview section.



Creating a Data Grid

Data Grids allow you to create tabular data. You can create a data grid from scratch or by copy-pasting data from a spreadsheet.

Creating a Data Grid From Scratch

Creating a Data Grid From a Spreadsheet

Creating a Data Grid From Scratch

To create a data grid from scratch, perform the following steps:

1 . From the Control Panel, click New Data Grid.

2 . Ensure that From Scratch is selected and click Next >.

3 . Enter Deadlines for Name. Enter Event in the first Column Name field. Enter Date in the second Column Name field and Date for Type. Then, click Create Data Grid.



4 . The data grid is created. To add data to the data grid, click Add Row.

5 . Enter Update Payroll for Event and select a date for Date. Click Save and Add Another.



6 . Enter Complete New Hire Training for Event and select a date for Date. Click Save.

7 . The data is added to the data grid.



Creating a Data Grid From a Spreadsheet

To create a data grid from data in a spreadsheet, perform the following steps:

1 . Click the Create button and select New Data Grid.

2 . Select Copy and Paste and click Next >.

3 . Enter Tasks in the Name field. Copy the data from the task.xls file and paste it in the Paste Spreadsheet Data field. Click Upload.



4 . The spreadsheet data is added to the Tasks data grid.



Creating a New Page as a Copy

In this section, you will create a new page as a copy of the existing Home page and customize the new page. To create a new page, perform the following steps:

1 . Click the Create button and select New Page as a Copy.

2 . Enter Reports for New Page Name and click Copy Page.

3 . Click View New Page.



4 . Click the Edit icon for the Overview section.

5 . Delete the existing content and enter This page contains some useful reports. in the Content field and click Apply Changes.

6 . The section is updated.



Creating a Data Section Based on Data From a Data Grid

In this topic, you will create a data section in the new page. Perform the following steps:

1 . From the Control Panel section, click New Section.

2 . Select Data and click Next.



3 . Select Deadlines for Data Grid and select Primary Report for Report Settings to Use. Enter Deadlines For This Month in the Title field and select Next >.

4 . Click Create Section.



5 . A report on the Deadlines data gird is created in a new section.

Creating a Chart Section Based on Data From a Data Grid

In this section, you create a chart section based on data from a data grid. Perform the following steps:

1 . Click Create and select New Section.

2 . Select Chart and click Next >.



3 . Accept the default for chart type and click Next >.

4 . Select Tasks for Data Grid and Primary Report for Report Settings to Use. Enter Cost Per Project for Section Title and click Next >.

5 . Select PROJECT for Chart Label and COST for Chart Value. Enter Projects for Axis Title for Label and Cost for Axis Title for Value. Then, click Next >.




7 . A chart is created in a new section in the page.



Creating a Section Navigation

In this topic, you will create a section navigation for all the sections in the Reports page. Perform the following steps:

1 . From Control Panel, select New Section.

2 . Select Navigation and click Next >.



3 . Select Section Navigation and click Next >.

4 . Enter Sections for Title and click Create Section.

5 . The navigation section is created, but it is the last section on your page. You want to move the navigation section to the top of the page. Click Edit Sections from the Control Panel.



6 . Click the up icon for Sections till it is the topmost section in the list and click Apply Changes.

7 . The navigation section is moved to the top of the page.

Viewing a Page in Presentation Mode

In this topic, you will view the Reports page in Presentation mode. Perform the following steps:



1 .Click the Presentation Mode icon from the top-right toolbar. Alternatively, you can click View and select Presentation Mode.

2 . The first section in the page is displayed. You can move to the next section by clicking the next icon.

3 . To close the presentation mode, click the cross (X) icon.

Creating Page Navigation

In this topic, you create a page navigation section on the Home page. Perform the following steps:



1 .To navigate to the Home page, click Page Directory from the Control Panel.

2 . Click the Home page icon.

3 . Click New Section from Control Panel.



4 . Select Navigation and click Next >.

5 . Ensure that Page Navigation is selected for Navigation Type and click Next >.

6 .Enter Pages for Title. Click the up icon for Starting Page and select --Select Starting Page-- . Select Created Date for Order Siblings By.






8 . The page navigation section is created.

Viewing Page History

In this topic, you will view the history for a page. Perform the following steps:

1 .Click the View history link at the bottom of the page. Alternatively, you can click View and select Page History.



2 . The history for the page is displayed. Click the Home breadcrumb to return to the Home page.



Searching in a Websheet

In this topic, you will search the entire websheet for the word "Projects". Perform the following steps:

1 .Enter Projects in the top-right search bar and click Enter.

2 . A report listing all the occurances of the search string is displayed. Click the Home breadcrumb to return to the Home page.



Creating Oracle Application Express Users

In order to share Websheets, it is necessary to define appropriate access control for the other Oracle Application Exprses users. In this topic, you will create three Oracle Application Express users. Perform the following steps:

1 . Click the Builder icon at the top-right of the websheet.

2 . Click the Administration tab and select Manage Users and Groups.



3 . Click the Create User >.

4 . Enter WS_ADMIN for Username and [email protected] for Email Address. Ensure that User is an administrator is set to Yes and enter obe for Password (not shown in the screenshot). Then, click Create and Create Another.

5 . Enter WS_CONTRIBUTOR for Username and [email protected] for Email Address. Select No for User is an administrator and enter obe for Password (not shown in the screenshot). Then, click Create and Create Another.



6 . Enter WS_READER for Username and [email protected] for Email Address. Select No for User is an administrator, No for User is a Developer and enter obe for Password (not shown in the screenshot). Then, click Create.

Sharing Websheets Using an Access Control List

In this topic, you will create an Access Control List for the websheet. Perform the following steps:

1 . Click the Applicaiton Builder tab and select Websheet Applications.



2 . Click the websheet icon.

3 . Click Run.

4 . Click Administration and select Access Control.



5 . Click Create Entry >.

6 . Enter ws_reader for Username and click Create and Create Another.

7 . Enter ws_contributor for Username, select Contributor for Privilege, and click Create and Create Another.



8 . Enter ws_admin for Username, Administrator for Privilege, and click Create.

9 . Now you need to change your Authorization Scheme to use the Access Control List you have just created. Click Administration and select Application Properties.

10 . Expand the Authorization region and select Custom.

11 . Click Apply Changes.



12 . Logout and login as the ws_contributor user.

13 . Click Administration and note that only the option to change the password is available.

14 . Logout and login again as the ws_reader user.



15 . Note that the options to create and edit content are disabled.

Summary

In this tutorial, you have learned how to:

Create a websheet applicationCreate pages and section in a websheet applicationAnnotate websheet pages with tags, notes, and filesDisplay an imageCreate a data grid from scratch and from a spreadsheetCreate data and chart sectionsCreate page and section navigationView a page in presentation modeView page historySearch for content in a websheetShare websheets using Access Control List

ResourcesOracle Application Express homepage on OTN.Oracle Learning LibraryOracle University

Copyright © 2011, Oracle and/or its affiliates. All rights reserved



Building a Websheet Application in Application Express 4.1

Documents