Developing a Customized BI Beans JSP Application

Purpose

In this lesson, you will learn how to develop a customized business intelligence JSP application by using BI Beans JSP tags. All of the application code that you need will be generated by HTML and JSP tag wizards.

You will incorporate two BI Beans presentations, a crosstab and a graph, into a JSP page that you have designed with a custom layout. You will also add custom application features that enhance the user interaction with the presenations.

Optionally, you can add a second page to the application that contains a graph and additional custom JSP application features. If you choose to create the second page, you will also learn how to add navigation between the pages.

As you develop the application, you will test it by running it from within JDeveloper.

Overview Topics

	Overview
	Prerequisites

Topics

This lesson will discuss the following (please complete these topics in sequence):

	Download, Extract, and Open the BI Beans OBE Project (optional)
	Create a BI-Enabled JSP Page
	Add Presentations to the JSP Page
	Add a Measure List and a Dimension Member List to the JSP Page
	Create a second JSP Application Page (optional)
	Summary

Time to complete

60 minutes

Viewing Screenshots

Move your mouse over this icon to show all screenshots. You can also move your mouse over each individual icon to see only the screenshot associated with it.

Overview

In JDeveloper, you can create a customized business intelligence JSP application easily by using BI Beans JSP tags. From the Component Palette, you select tags that you need to incorporate specific functionality into your JSP page.

Oracle BI Beans provides JSP tags that exploit Oracle OLAP query analysis features and new presentation formatting capabilities for the web.

Back to Topic List

Lesson Objectives

In this lesson, you learn how to use some of the new BI Beans JSP tags to build a complete business intelligence application.

While developing the application, you will perform the following tasks:

1.	Create a BI-enabled JSP page to host presentations.
2.	Add a crosstab to the JSP page.
3.	Insert a View Toolbar to enable formatting, sorting, and other presentation controls.
4.	Add a linked graph to the JSP page.
5.	Add a tool to invoke the Presentation Editor.
6.	Add a list that enables easy selection of measures displayed in the crosstab and graph.
7.	Add a list that enables easy selection of dimension members to display in the crosstab and graph.

Optionally, you can perfom these additional tasks:

8.	Create a second page with a graph.
9.	Add a tool that enables users to change the graph type and style.
10.	Add a tool that lets users apply saved selections to the graph.
11.	Enable navigation between pages in the application.

Data Model

For information on the data model used in the BI Beans OBE lessons, please see the Data Model page.

High Level Objectives

The general business requirements of the BI Beans OBE lessons are described in the Business Requirements page.

Prerequisites

In order for this lesson to work successfully, you will need to have performed the following:

Back to Topic List

Business Intelligence Beans provides a set of samples to help you learn how to use the product. These samples use the Oracle Common Schema analytic workspace as the sample data set. The BI Beans OBE lessons also use the Common Schema analytic workspace as the sample data set.

Therefore, if the BI Beans samples have been installed, you should have access to the analytic workspace for the BI Beans OBE lessons. If the BI Beans samples have not been installed, refer to Installing the Common Schema for detailed instructions on how to install the Common Schema sample data set.

Complete the first three lessons in the Develop Business Intelligence Objects focus area.

Or,

You can use a BI Beans Project that contains all of the files that would result from the completion of the tutorials in the first focus area. To use this project, follow the instructions in Download, Extract, and Open the BI Beans OBE Project.

Note: If you have completed any other lesson in this focus area, then you already have the BI Beans OBE project that is required for this lesson.

Additional Practice

The goal of this lesson is to teach you how to perform certain development tasks while creating a customized BI Beans JSP application.

For more practice on how to use a BI Beans JSP application as an end-user, please complete the OBE lesson entitled Generating a BI Beans JSP Application, which is part of this OBE Focus Area. In that particular lesson, the topic entitled Run the Application covers much of the end-user functionality that is provided in a BI Beans JSP application.

Back to Topic List

Download, Extract, and Open the BI Beans OBE Project (optional)

To create a BI Beans application, you must first develop the BI Beans objects that will be used by the application.

Back to Topic List

If you have not completed the first three lessons in the Develop Business Intelligence Objects focus area, or if you have not already downloaded and extracted the BI Beans OBE Project as part of another lesson in this focus area, use this optional topic. Otherwise, skip this topic and move directly to the Create a BI-Enabled JSP Page topic.

This topic contains instructions for downloading and opening the JDeveloper Project that contains all of the files and objects that you need for this lesson.

To download and open the BI Beans OBE Project, follow these steps:

First create a new Workspace. From the File menu, select New. The New Gallery Dialog box opens.

In the New Gallery dialog box, under Categories, select General; under Items, select Workspace and click OK.

The Create Workspace dialog box opens.

In the Create Workspace dialog box, accept the default name and directory for the workspace.

Note: Make note of the path for your workspace Directory Name.

Ensure that the Add a New Empty Project box is not checked, as shown in the screen shot below:

Click OK to create the Workspace. Click the Save All tool to save the Workspace.

Save the following self-extracting archive, Project1.exe, to your local machine.

For example, use your browser's right-mouse menu to perform a Save As.

Note: Due to virus protection rules, the self-extracting archive may copy to your machine with the name Project1, rather than Project1.exe. If this is the case, you will need to rename the file on your local machine by adding the .exe extension before extracting its contents.

Once you have downloaded the archive, and renamed it if necessary, extract the contents of the archive using the following steps:

A.	Double-click on the self-extracting archive, Project1.exe.
B.	In the WinZip Self- Extractor dialog box, use the Browse button to navigate to the directory that was just established by the creation of your new JDeveloper Workspace. For example, <JDeveloper_home>\jdev\mywork\Workspace1.
C.	Click the Unzip button.

The BI Beans OBE project is upzipped into your workspace directory.

Close the WinZip Self- Extractor dialog.

In the JDeveloper Applications-Navigator, select the new Workspace that you just created in Steps 1. - 3.

Then, from the main menu select File > Open.

In the Open dialog, navigate to the Project1 directory below your workspace directory. This directory was created when you extracted the archive in Step 4.

Select Project1.jpr

Click Open.

The Workspace and associated Project are displayed in the Applications-Navigator.

Expand all of the nodes in the Workspace, and you should see the following project files in the Applications-Navigator:

Now, you must specify your database connection to the Oracle Common Schema analytic workspace in the BIDesigner. To do this, perform the following:

A.	Right-mouse click on Project1BIDesigner and select Settings from the popup menu.
B.	In the BI Designer Settings dialog box, click the Edit button just beneath the Connection drop-down box. The OLAP Connection Editor is displayed.
C.	Select the Connection tab in the OLAP Connection Editor. Modify the connection details for your Oracle OLAP data source.
D.	Select the Test tab. Then, click Test Connection to verify that your connection is valid. Click OK to close the OLAP Connection Editor. Notes: If the connection fails, return to the Connection tab and re-enter the connection information for your Oracle Common Schema analytic workspace data source. If you have not installed the Common Schema sample data set, follow the instructions in Installing the Oracle Common Schema, which is described in the Prerequistes section.
E.	Click OK to close the BI Beans Settings dialog box.

From the File menu, choose Save All.

Create a BI-Enabled JSP Page

In this topic, you will use a BI Beans wizard to generate an empty JSP page that is preconfigured for the incorporation of BI functionality.

When you create an empty BI JSP page as described in this topic, the wizard generates the definition of a BIThinSession and a form that will be used to handle BI Beans events such as drilling and paging. These two objects are necessary for creating any JSP page for a BI Beans application.

Back to Topic List

Please complete the following subtopics in sequence:

	Create a New Crosstab and a Calculation
	Create a New Project for the JSP Application
	Create an Empty BI JSP Page

Create a New Crosstab and Calculation

In the first Focus Area of BI Beans OBE lessons, Develop Business Intelligence Objects, you learned how to create analytic objects such as Crosstabs, Graphs, Calculations, and Saved Selections. You also learned how to enhance these objects by using the Query Editor, Crosstab Customizer, and Graph Customizer.

Here, before you create the first BI-enabled JSP page for your application, you will create a simple crosstab and a calculation that will be used to display three key profitability indicators (KPIs) for the JSP application.

Back to Subtopic List

To create the new crosstab and calculation for the JSP application, follow these steps:

First, create the crosstab.

In the Applications-Navigator pane, locate the project that contains your BIDesigner. Then, right-click Project1BIDesigner1 and select New Crosstab from the menu.

The Presentation Wizard is launched. Click Next in the Welcome page.

In Step 1, specify the presentation name and description that will be associated with the crosstab as follows:

Presentation Location and Name:	KPI Analysis
Description:	KPI Analysis

Click Next to continue.

In Step 2, select the measures for this crosstab, and then remove the Promotion dimension from the query.

A.	Expand the Electronics-KPIs measure folder in the Available list. Then, multi-select the measures Sales Revenue and Sales Cost.
B.	Use the Add Selected Items button (">") to move these measures to the Selected list.
C.	Then, in the Selected list, choose Promotion and click the Remove Selected Items button ("<")

The completed Items selection should look like this:

Click Next to continue.

In Step 3, modify the layout of the crosstab.

To rearrange dimensions, select a dimension, and use a drag-and-drop operation to move the dimension to the desired position. Rearrange the dimensions so that the layout appears as follows:

Page Items:	Product, Time, Channel
Columns:	Measure
Rows:	Geography

Bypass the remaining steps in the wizard and click Finish to create the crosstab, which should look like this:

The KPI Analysis crosstab is added to your Local Catalog in the Applications Navigator.

From the File Menu, select Save All to save your work. Then choose File > Close to close the crosstab.

Now, create a calculation for Profit.

In the Applications-Navigator pane, right-click Project1BIDesigner1 and select New Calculation from the menu.

The Calculation Wizard is launched. Click Next in the Welcome page.

In Step 1 of the wizard, name the calculation Profit.

Here, you also specify the calculation type. For Calculation type, open the Basic Arithmetic folder and select Subtraction.

Click Next to continue.

In Step 2, select Sales Revenue in the Value box, and Sales Cost in the Minus box.

If the measure you want is not listed in the drop-down box, select More to display a list of all available measures. In the Select Measure dialog box, open the Electronics-KPIs folder, select the appropriate measure from this folder, and then click OK.

For example:

The completed Subtraction step should look like this:

Click Finish to create the calculation.

The Profit calculation is added to your Local Catalog in the Applications Navigator.

10.

From the File Menu, select Save All to save your work.

Create a New Project for the JSP Application

Back to Subtopic List

To create the new project for your application, follow these steps:

1.	In the Navigator, right mouse click on Project1 and select New from the popup menu.
2.	In the New Gallery dialog box, select General from Categories panel and select Empty Project from the Items panel Then click OK.
3.	Accept the default values provided in the Create Project dialog and click OK.
4.	From the main menu, choose File > Save All.

Create an Empty BI JSP Page

Here, you will generate a JSP page that is preconfigured for BI Beans JSP application development.

Back to Subtopic List

Follow these steps to generate a pre-configured, empty BI JSP page:

In the Navigator, right-click on the Project that you just created in the previous subtopic. Select New from the popup menu.

In the New Gallery dialog box, perform the following:

In the Categories box, expand the Business Intelligence Beans node and then expand the Web Tier node. Select JavaServer Pages.

In the Items box, select Empty BI JSP Page.

Click OK.

The Empty BI JSP Page wizard is opened.

Enter analyze.jsp as the Page Name. Accept the default runtime configuration file that was previously created for the BIDesigner, and also accept the default id for the BIThinSession tag (i.e. bisession1).

Click OK.

Note: The BIThinSession tag, which is required for building BI Beans applications for the web, encapsulates the connection to your OLAP data and to the BI Beans Catalog, where the definitions of your BI Beans objects are stored.

When your empty BI JSP Page is generated, a .jsp file and other support files are added to the Applications-Navigator window under the project.

The JDeveloper window layout should be divided into five areas as descibed below.

	Area 1: Applications-Navigator – Shows a list of project components, such as Designers, Java files, XML files, JSP files, HTML files, and so on.
	Area 2: Design/Source Window – Consists of two tabs: - The Design tab – Displays the UI view of the application and allows a developer to edit the design visually. - The Source tab – Displays the JSP tags and allows a developer to edit the application code directly.
	Area 3: Structure Window – Displays a view of application objects in a hierarchical drillable tree mode. This display is dependent on the tab that is selected in Area 2, and it refreshes automatically when you select a different tab.
	Area 4: Component Palette – Displays a list of JSP and HTML components that can be used within an application.
	Area 5: Property Inspector – Displays a window that is linked to the Structure window. Selecting a component in the Structure window updates the Property Inspector.

From the main menu, choose File > Save All.

Now, take a closer look at the generated application code. Click on the Source tab at the bottom of the Design Editor to display the JSP code.

BI Beans JSP tag libraries are required for building BI applications for the web. The tag library descriptors for these libraries are included in the generated JSP as shown below:

The JSP Page dialog also generates a BIThinSession tag, and an HTML document with a head and body containing a form, as shown below:

You are ready to add BI objects to this BI-enabled JSP page.

Click on the Design tab at the bottom of the Design/Source Editor.

Add Presentations to the JSP Page

In this topic, you will add two presentations to the first JSP page. In addition, you will add the Presentation Toolbar which enables users to modify the format of presentations. Finally, you will add a button that invokes the Presentation Builder, which enables modification of presentation queries.

Back to Topic List

To add the application functionality, you will use HTML and JSP tags that are accesible from the JDeveloper Component Palette. As you add these tags to your application, wizards are displayed to gather the appropriate information from you. These wizards generate the JSP code that is required for the application to run.

Please complete the following subtopics in the sequence listed below to add the required functionality:

	Prepare the Page by Adding an HTML Table
	Add a Crosstab to the Page
	Add a Linked Graph to the Page
	Insert the Presentation Toolbar
	Add a Button to Invoke the Presentation Editor

Prepare the Page by Adding an HTML Table

The analyze.jsp page will contain four primary elements: a crosstab, a graph, a list to display available measures, and a list to display available dimension members. In this subtopic, you will add an HTML table to the page that contains four cells. Each cell in this table will be used as the container for a particular page element.

Back to Subtopic List

To add the HTML table to the page, follow these steps:

In the Design Editor, position the cursor between the “InitBITags” and “InsertHiddenFields” tags.

Hint: To ensure that the cursor is positioned appropriately, look at the Structure window. The paragraph ("p") tag that immediately follows the "Insert your Business Intelligence tags here" comment should be selected.

You may add an additional paragraph tag to the page by pressing Enter while the cursor is in the Design tab.

In the Component Palette, select the HTML tag library, and click the Table tag.

The Insert Table dialog is displayed.

Use the Insert Table dialog to specify an HTML table with 2 rows and 2 columns, and border width 0, as shown below:

Click OK to create the table, which is inserted into the JSP page.

The Structure window is also updated with the table object:

Add a Crosstab to the Page

Previously, BI Beans presentation objects (crosstabs and graphs) were created. The definitions for these objects are in your local BI Beans Catalog, which is referenced in the BIDesigner that is in Project1. Now, you will add one of these presentations, the KPI Analysis crosstab, to the JSP page by placing it in the upper-right cell of the HTML table.

Back to Subtopic List

To add the crosstab to the page, follow these steps:

In the Design Editor, position the cursor inside the top right cell of the table, as shown here.

In the Component Palette, select the BI Beans General Tags library. Then, scroll down and click the Presentation tag.

The Presentation tag wizard is displayed.

In the Presentation tag wizard, perform the following:

A.	Accept the default value (analyze_pres1) for the id property.
B.	Click in the location box, and then click the ellipses (…) button that appears to the right of the box. The Location dialog, which displays objects from your local BI Beans Catalog, is opened.
C.	In the Location dialog, select KPI Analysis. Click OK. A reference to the crosstab is added as the location property value in the Presentation tag wizard.
D.	Click Finish to create the Presentation tag.

The Design Editor is refreshed to display the crosstab with its paging control.

From the File menu, select Save All, or click the Save All tool.

Add a Linked Graph to the Page

Now, you will add a graph to the application that will share the query with the crosstab. This graph will be placed below the crosstab by placing it in the lower-right cell of the HTML table.

Back to Subtopic List

To add the graph to the page, follow these steps:

In the Design Editor, position the cursor inside the bottom right cell of the table, as shown here:

On the Component Palette, under the BI Beans General Tags, click on the Presentation tag.

In the Presentation tag wizard, perform the following:

A.	Accept the default value (analyze_pres2) for the id property.
B.	For the newViewType property, select Graph.
C.	For the linkedQuery property, select analyze_pres1 (which is the id property value for the crosstab). The Presentation tag properties should look like this:
D.	Click Finish to create the Presentation tag.

The Design Editor is refreshed to display the linked graph below the crosstab.

From the File menu, select Save All, or click the Save All tool.

In the Applications-Navigator window, right-click analyze.jsp and select Run.

This action initiates the embedded servlet container (OC4J) in JDeveloper and opens the JSP in a browser.

Although the current state of the application is simplistic, the crosstab and graph provide live access to the underlying OLAP data source.

For example, in the crosstab, click on the drill symbol ("+") next to World total.

The Geography dimension in the crosstab expands to display the drilled data. The graph also updates to display the same data automatically. This occurs because the graph is linked to the crosstab based on the layout and query that is defined for the crosstab.

When you finish experimenting with the application, close the browser and return to JDeveloper.

Then, from the Run menu, select Terminate > Embedded OC4J Server to stop the application.

Insert the Presentation Toolbar

You can enhance the controls of a crosstab or graph that is displayed in a BI Beans JSP application by adding the Presentation Toobar. This toolbar allows the user to change view type, modify the layout, apply formatting, sort the data, and apply saved selections to a presentation.

You will associate the Presentation Toolbar with the crosstab, since the crosstab is the driver of the query for the presentations on this page.

Back to Subtopic List

To insert the Presentation Toolbar just above the crosstab, follow these steps:

In the Design Editor, click on the crosstab so that it is selected, as shown here:

Then, click the Source tab a the bottom of the Design/Source Editor. The Render tag for the crosstab is selected.

Press the Home key to position the cursor at the beginning of the code line. Then, press the Enter key to add a blank line above the Render tag.

On the blank line, enter the following characters: <p/> (the "p" is lowercase). The resulting new line should look like this:

Click the Design tab at the bottom of the Design/Source Editor. A new line has been added just above the crosstab inside the same table cell. The new line is also indicated in the Structure window.

On the Component Palette, under the BI Beans General Tags, click the Toobar tag.

In the Toolbar tag wizard, perform the following:Accept the default value for the id; for the “presentationId” attribute choose “analyze_pres1

Accept the default value (analyze_toolbar1) for the id property.

For the presentationId property, choose analyze_pres1 (which is the id property value for the crosstab).

Click Finish to create the Toobar tag.

The Design Editor is refreshed to display the Toolbar above the crosstab.

In the Applications-Navigator window, right-click analyze.jsp and select Run. Again, the JSP is opened in a browser.

Click on the Layout tool to display the Layout options.

Select the following options in the Layout tool:

option 1:	Swap
option 2:	Product
option 3:	With Geography

Click Go to change the layout.

Now, drill on Product total in the crosstab. The crosstab and graph are refreshed with the data.

Collapse the Product dimension by clicking on the Drill Collapse icon next to Product total.

Since the crosstab and the graph share the same query and layout, you can drill on either presentation object, and the other will update automatically.

In the graph, drill on the Total Product link.

Once again, the crosstab and graph are refreshed with the data, but this time the graph contains a Drill Collapse link, as shown here:

Collapse the Product dimension by clicking on the Product total Drill Collapse link in the graph.

When you finish experimenting with the application, close the browser and return to JDeveloper.

Then, from the Run menu, select Terminate > Embedded OC4J Server to stop the application.

Add a Button to Invoke the Presentation Editor

The Presentation Editor is an HTML-based version of the BI Beans Query Editor. It enables users to easily modify the query of a presentation in a BI Beans JSP application.

In this subtopic, you will add a button to the JSP page that invokes the BI Beans Presentation Editor. This button will be associated with the crosstab, since the crosstab is the driver of the query for the presentations on this page.

Back to Subtopic List

To add the Presentation Editor button, follow these steps:

Using the Design Editor and the Source Editor, add another blank line to the table cell that contains the crosstab. Use the same technique that was used in the previous subtopic for this task. However, this time, add a blank line after the crosstab.

In the Design Editor, click on the crosstab so that it is selected, as shown here:

Click the Source tab a the bottom of the Design/Source Editor. The Render tag for the crosstab (analyze_pres1) is selected.

To add a blank line after the Render tab, press the End key to position the cursor at the end of the code line, then press Enter to add a new line below the Render tag.

On the blank line, enter the following characters: <p/> (the "p" is lowercase). The resulting new line should look like this:

Note: Also notice the Render tag for the Toolbar (analyze_toobar1) has been added above the crosstab. The Toolbar tag that you used in the previous subtopic generated this code.

Click the Design tab a the bottom of the Design/Source Editor. The new line has been added to the same table cell, below the crosstab.

On the Component Palette, under the BI Beans General Tags, click the Button tag.

In the Button tag wizard, perform the following:

Enter analyze_button1 for the id property.

Enter Edit for the Text property.

The property values should look like this:

Click Finish to create the Button tag.

The Design Editor is refreshed to display the Edit button below the crosstab.

Right-click on the button and choose Set BI Action from the menu.

The Set BI Action dialog is displayed.

In the Set BI Action dialog, choose analyze_pres1 in the Target Objects box, and choose Show Presentation Builder in the Actions box.

Notes:

The Set BI Actions dialog provides access to many BI Beans wizards and dialogs. For example, the Show Explorer action will display an Open dialog box that serves as a BI Beans Catalog browser; the Show Presentation Builder action will display the Presentation Editor wizard, as you will see in a moment; and the Show Save As action will display the Save As dialog box, which enables you to save a modified presentation to the BI Beans Catalog. You can asssociate any of the BI Actions listed in this dialog with an object such as a button or a link.

The BI Action, which displays a BI Beans wizard or a dialog, will be associated with the object that you select in the Target Objects box. In this example, the Presentation Editor will enable the user to edit the query for analyze_pres1, which is the object id for the crosstab.

When the application runs, a click event on the button will invoke the action, and the appropriate wizard or dialog that you have specified will be displayed.

Click OK to set the BI Action on the Edit button.

In the Applications-Navigator window, right-click analyze.jsp and select Run. Once again, the JSP is opened in a browser.

Click the Edit button to display the Presentation Editor.

Click the Refine Selections tab. Here, you will refine the selection for the Product dimension.

First, scroll down to the Product dimension, and click the Create Step button as shown in the following image:

Then, perform the following to add all product division members to the selection:

A.	In the Step: Type screen, choose the Select Members option and click Continue.
B.	In the left panel of the Select Members Step screen, perform the following: - Click the Expand symbol ("+") next to Product total to display the division members. - Select all five product divisions by checking the box to the left of each member. - in the Action list, select the Add members... option.
C.	Click on the Add icon ('>') to add the dimension members to the list of Selected Items.
D.	Click the Finish button at the top right corner of the Select Members Step screen to add the members to the product selection.

In the Refine Selections tab, the Product dimension selection now includes the following Steps:

Finally, click Apply in the top right corner of the Presentation Editor to apply the dimension selection change.

In the Product dimension box in the Page Items region, select a new product dimension member to update the crosstab and the graph.

For example, select the Electronics division and click Go.

You can use the Presentation Editor to modify the selections of any dimension in the query.

Note: For more information on using the Presentation Editor in a BI Beans JSP application, please refer to the OBE lesson entitled: Generating a BI Beans JSP Application.

10.

When you finish experimenting with the application, close the browser and return to JDeveloper.

Then, from the Run menu, select Terminate > Embedded OC4J Server to stop the application.

Add a Measure List and a Dimension Member List to the JSP Page

In this topic, you will add two more objects to the JSP page.

The first object will contain a list of measures from which users can easily add or remove measures for the crosstab and graph. The Measure List will be placed in the HTML tabel cell to the left of the crosstab.

The second object will contain a list of members for the Geography dimension. This list will enable users to interactively select certain geography dimension members for the presentations without using the Presentation Editor. The Dimension Member List will be placed in the HTML table cell to the left of the graph.

Back to Topic List

Complete the following subtopics to add the List objects to your JSP page:

	Add a Measure List
	Add a Dimension Member List

Add a Measure List

BI Beans provides a library of List tags for different kinds of lists. Here, you will use the MeasureList tag, which renders a list of measures as checkboxes, combo box, links, list, as so forth.

Back to Subtopic List

To add a Measure List, follow these steps:

In the Design Editor, position the cursor in the HTML table cell to the left of the cell containing the crosstab.

On the Component Palette, select the BI Beans List Tags library. Then, click the MeasureList tag.

The Measure List wizard is displayed.

In Step 1 of the MeasureList tag wizard, perform the following:

Accept the default value for the id property (analyze_measureList1).

Click in the targetPresentationIds property, and then click the ellipses (…) button that appears to the right of the box. Then, in the targetPresentationIds dialog, select analyze_pres1 and click OK.

Click in the measures box, and then click the ellipses (…) button that appears to the right of the box.

In the measures dialog, select Sales Revenue and Sales Cost from the Electronics KPIs folder, and also select the Profit calculation, as shown here:

Click OK to add these items to the measures property.

Click Next to continue in the wizard.

In Step 2 of the MeasureList tag wizard, specify the rendering options as follows:

In the Render List As region, select Check boxes as the list Type.

Accept the default options for the Label and Layout regions.

In the Submission Options region:

- Select Link in the Method drop-down list.

- Deselect the Use Default Text option.

- Enter Apply Selection in the Text box.

The completed wizard Step 2 should look like this:

Click Next to continue in the wizard.

In Step 3 of the wizard, select the Default list style and click Finish.

The Measure List is displayed in the Design Editor:

Add a Dimension Member List

You will now add a Dimension Member List to complete your development tasks for the current JSP page. You will use the DimensionMemberList tag, which renders a list of dimension members as checkboxes, combo box, links, and so on.

Back to Subtopic List

Follow these steps to add a Dimension Member List for the Geography dimension that contains all members at the Country level in the Standard hierarchy:

In the Design Editor, position the cursor in the HTML table cell to the left of the cell containing the graph.

On the Component Palette, in the BI Beans List Tags library, click the DimensionMemberList tag.

The DimensionMemberList wizard is displayed.

In Step 1 of the wizard, specify the following properties:

A.	Accept the default value for the id property (analyze_dimMemList1).
B.	Click in the targetPresentationIds property, and then click the ellipses (…) button that appears to the right of the box. Then, in the targetPresentationIds dialog, select analyze_pres1 and click OK.
C.	Click in the dimension box, and then click the ellipses (…) button that appears to the right of the box. In the dimension dialog, open the Electronics KPIs folder and select Geography. Then, click OK to add the dimension reference to the Wizard.
D.	Click in the hierarchy box, and then click the ellipses (…) button that appears to the right of the box. In the hierarchy dialog, select Standard and click OK to add the hierarchy reference to the Wizard.
E.	Click in the levels box, and then click the ellipses (…) button that appears to the right of the box. In the levels dialog, select Country and click OK to add the level reference to the Wizard.
F.	In the multiSelect property box, choose True.

The DimensionMemberList wizard properties should now look like this:

Click Next to continue in the wizard.

In Step 2 of the wizard, specify the rendering options as follows:

In the Render List As region, select List box as the list Type.

Accept the default options for the Label and Layout regions.

In the Submission Options region:

- Select Link in the Method drop-down list.

- Deselect the Use Default Text option.

- Enter Apply Selection in the Text box.

The completed Wizard Step should look like this:

Click Next to continue.

In Step 3 of the DimensionMemberList tag wizard, choose any list style that you like and click Finish.

The DimensionMemberList is displayed in the Design Editor:

In the Applications-Navigator window, right-click analyze.jsp and select Run. Once again, the JSP is opened in a browser.

You can now use the two List objects to interact with the crosstab and graph.

In the Measures list, choose all three measures and then click the Apply Selection link to update the presentations.

In the Geography list, choose Canada, Brazil, Singapore, and Japan. Then, click the Apply Selection link to update the presentations.

Continue to experiment with the lists, Toolbar and Edit button. When you finish experimenting with the application, close the browser and return to JDeveloper.

Then, from the Run menu, select Terminate > Embedded OC4J Server to stop the application.

Create a second JSP Application Page (optional)

In this topic, you will add a second page to this JSP application. The new page will contain a Graph and two List tags for modifying graph properties at run time.

The first List tag will enable users to easily change the graph type, and the second List tag will let users choose from a specific group of saved selections without having to access the Presentation Editor.

Back to Topic List

Complete the following subtopics to add the List objects to your JSP page:

	Create a New BI JSP Page and Add a Graph
	Add a List for Graph Type
	Add a List for Saved Selections
	Add Navigation for the JSP Pages

Create a New BI JSP Page and Add a Graph

Here, you will generate a second JSP page that is preconfigured for BI Beans JSP application development. Then, you will add a Graph object that was created previously.

Back to Subtopic List

Follow these steps to generate the BI JSP page and add the graph:

In the Navigator, right-click on the Project that contains your first JSP page. Select New from the popup menu.

In the New Gallery dialog box, perform the following:

A.	In the Categories box, expand the Business Intelligence Beans node and then expand the Web Tier node. Select JavaServer Pages.
B.	In the Items box, select Empty BI JSP Page.
C.	Click OK.

The Empty BI JSP Page wizard is opened.

Enter analyze2.jsp as the Page Name. Accept the default runtime configuration file that was previously created for the BIDesigner, and also accept the default id for the BIThinSession tag (i.e. bisession1).

Click OK.

The empty BI JSP Page is generated and displayed in the Design/Source Editor.

Click Save All to save the JSP page.

In the Design Editor, position the cursor between the “InitBITags” and “InsertHiddenFields” tags. Add an extra blank line, and then position the cursor above the blank line.

In the Component Palette, select the BI Beans General Tags library. Then, scroll down and click the Presentation tag.

In the Presentation tag wizard, perform the following:

A.	Accept the default value (analyze2_pres1) for the id property.
B.	Click in the location box, and then click the ellipses (…) button that appears to the right of the box. The Location dialog, which displays objects from your local BI Beans Catalog, is opened.
C.	In the Location dialog, select Sales Analysis Graph. Click OK. A reference to the graph is added as the location property value in the Presentation tag wizard.
D.	Click Finish to create the Presentation tag.

The graph is displayed in the Design Editor.

Before adding the List tags to the page, insert an HTML table below the graph.

Place your cursor in the blank line below the graph, and then choose the HTML library in the Component Palette. Click the Table tag.

In the Insert Table dialog define a table of 1 Row, 2 Columns, and a Border size of 0.

Click OK to insert the Table.

The Design Editor displays the table below the graph.

Click Save All to save your work.

Add a List Tag for Graph Type

Now, you will add a List tag that enables a user to change the graph type by selecting from a list of graph type options that you specify.

To create this list, you will use the PropertySettingsList tag, which lets you select specific property values for a given presentation. The properties that you select are then exposed in the user interface.

Back to Subtopic List

Follow these steps to add the PropertySettingsList tag to the JSP page:

In the Design Editor, position the cursor in the left cell of the HTML table below the graph.

On the Component Palette, in the BI Beans List Tags library, click the PropertySettingsList tag.

The PropertySettingsList wizard is displayed.

In Step 1 of the wizard, accept the default value for the id property (analyze2_propSetList1).

Click Next to continue.

In Step 2 of the wizard, specify the property setting options as follows:

Click the Add button at the bottom of the property settings box to display the Add List Item dialog.

In the Add List Item dialog, enter or select the following values:

List Item Label:	Bar
Target Object:	analyze2_pres1
Property name:	graphType
Property Value:	Click in the box, and then click the elipses ("...") button to display the graphType dialog. Choose the Bar graph type and then click OK.

The completed Add List Item dialog should look like this:

Click OK to save the list item properties.

The property settings box should now look like this:

Repeat the same process to add property setting values for Horizontal Bar and Pie graph types.

Hint: in the Item List Label property for each value, use the names Horizontal Bar and Pie respectively.

When you are finished, the property settings box should look like this:

Click Next to continue.

In Step 3 of the wizard, accept the list order and click Next to continue.

In Step 4 of the wizard, specify the rendering options as shown in the screen shot below:

Click Next to continue.

In Step 5 of the wizard, choose any list style that you like and click Finish.

The Graph Type List is displayed in the Design Editor:

Click Save All to save your work.

Add a List Tag for Saved Selections

In this subtopic, you will add a List tag that enables a user to change the dimension member selection for the Geography dimension by selecting from a list of Saved Selections.

To create this list, you will use the SavedSelectionsList tag.

Back to Subtopic List

Follow these steps to add the SavedSelectionsList tag to the JSP page:

In the Design Editor, position the cursor in the right cell of the HTML table below graph

On the Component Palette, in the BI Beans List Tags library, click the SavedSelectionsList tag.

The SavedSelectionsList wizard is displayed.

In Step 1 of the wizard, specify the following property values:

Accept the default value for the id property (analyze2_selList1).

Click in the targetPresentationIds property, and then click the ellipses (…) button that appears to the right of the box. In the targetPresentationIds dialog, select analyze2_pres1 and click OK.

Click in the selections box, and then click the ellipses (…) button that appears to the right of the box.

In the selections dialog, multiselect American Areas and European Areas. Then, click the Copy button (">") to add the two saved selections to the Selected Items list.

Click OK to add them to the selections box in the wizard.

The tag properties should look like this:

Click Next to continue.

In Step 2 of the wizard, specify the rendering options as shown in the screen shot below:

Click Next to continue.

In Step 3 of the wizard, choose any list style that you like and click Finish.

The Graph Type List is displayed in the Design Editor.

The Selections list is added to the Design Editor. You can increase the size of the Design Editor if you wish:

In the Applications-Navigator window, right-click analyze.jsp and select Run. Once again, the JSP is opened in a browser.

In the Graph Type list, cilck the Pie link (if necesary, click the Refresh button in your browser). The graph updates to display the new format.

In the Geography dimension drop-down list, notice that the countries in the Americas are selected by default.

In the Selections list, click the European Areas option to update the Geography dimension selection.

10.

When you finish experimenting with the application, close the browser and return to JDeveloper.

Then, from the Run menu, select Terminate > Embedded OC4J Server to stop the application.

Add Navigation for the JSP Pages

Finally, you will add a List tag that enables navigation between the pages of the JSP application. To create this feature, you will use the PageList tag.

Back to Subtopic List

Follow these steps to add the PageList tag to the first JSP page:

1.	In the Design Editor, switch back to the analyze.jsp page. Position the cursor on the top of that page, between the HTML table and the InitBITags tag.
2.	On the Component Palette, in the BI Beans List Tags library, click the PageList tag. The PageList wizard is displayed.
3.	In Step 1 of the wizard, enter pageList1 as the ID for the new page list. Click Next to continue.
4.	In Step 2 of the wizard, select both ot the JSP pages and click Copy (">") to move them over to the Selected Items list. Click Next to continue.
5.	In Step 3 of the wizard, enter the following values for the page Labels: analyze.jsp: KPI Analysis analyze2.jsp: Top 5 Photo Products Click Next to continue.
6.	In Step 4 of the wizard, select Navigator for the Render List Type. Then, deselect the Show Label option. Click Next to continue.
7.	In Step 5 of the wizard, choose any list style that you like and click Finish. The Navigation tool is added to the page.
8.	In the Design Editor, switch to the analyze2.jsp page. Add a blank line between the graph and the InitBITags tag and position the cursor there. Then, once again click the PageList tag from the BI Beans List Tags library in the Component Palette.
9.	In Step 1 of the wizard, choose the Select an existing page list option. The default value is pageList1. Click Next.
10.	Continue through the wizard and accept the defaults until you get to Step 4. In Step 4 of the wizard, make sure to select Navigator for the Render List Type. Then, deselect the Show Label option. Click Next.
11.	In Step 5 of the wizard, choose any list style that you like and click Finish. The Navigation tool is added to the page. Click Save All to save your work.
12.	Run the application and the Navigation tool to move between the pages.
13.	When you finish experimenting with the application, close the browser and return to JDeveloper. Then, from the Run menu, select Terminate > Embedded OC4J Server to stop the application.

Summary

In this lesson, you learned how to develop a customized business intelligence application using the BI Beans JSP tags.

You learned how to integrate a number of list tags that enable some common features that a customized BI Beans JSP application might require.

For more practice with BI Beans JSP applications, refer to the OBE lesson entitled Generating a BI Beans JSP Application.

Back to Topic List

Move your mouse over this icon to hide all screenshots