Tuesday, 16 October 2012

Adding Navigation in APEX

Adding Navigation

When you build an application, you can include different types of navigation controls, such as navigation bar entries, tabs, breadcrumbs, lists, and trees. This section describes how to implement navigation in your application.
Navigation controls are shared components, so you create the specific type of navigation control at the application level on the Shared Components page. After that, you can add them to any page within your application.
This section contains the following topics:
See Also:

Creating Tabs

Tabs are an effective way to navigate users between pages of an application. You can create a tabbed application look by using parent tabs, standard tabs, and lists.
Application Builder includes two different types of tabs:
  • Standard tabs
    An application having only one level of tabs uses a standard tab set. A standard tab set is associated with a specific page and page number. You can use standard tabs to link users to a specific page.
  • Parent tabs
    A parent tab set functions as a container to hold a group of standard tabs. Parent tabs give users another level of navigation as well as a context (or sense of place) within the application. You can use parent tabs to link users to a specific URL associated with a specific page.
Topics in this section include:
Note:
When running the Create Application Wizard, you have the option of creating an application with tabs. The following procedures assume you have already created an application that does not have any tabs.
See Also:
"Creating an Application"

About Template Support

Before you can create parent and standard tabs, you need to check that your default template has positions defined for both standard and parent tabs using the appropriate substitution strings. You also need to make sure you do not override this template at the page level.
See Also:

About the Tabs Section of the Page Definition

You can create and edit tabs on the Page Definition. Tabs display under the Shared Components section.
Description of pg_def_tabs.gif follows
Description of the illustration pg_def_tabs.gif

You can temporarily hide all other Shared Components subsections by clicking the Tabs icon under the Shared Components title. To restore the view, click Show All. The Show All icon resembles an inverted triangle.
The following icons appear in the Tabs section:
  • Edit All. The Edit All icon resembles a small grid with a pencil on top of it. Use this icon to edit all tabs at once.
  • Create. The Create icon resembles a plus (+) sign overlapping a small page. Click this icon to create a new tab.
  • Reorder. The Reorder icon resembles light green down and up arrows. Click this icon to edit the label and location of tabs.
To edit a tab, click the tab name.
See Also:
"About the Tabs Page" and "Using the Reorder Tabs Icon"

Using the Reorder Tabs Icon

You can quickly edit the label and location of tabs by clicking the Reorder Tabs icon. It appears in the Tabs section of the Page Definition. This icon resembles light green down and up arrows.
Description of reorder_tabs.gif follows
Description of the illustration reorder_tabs.gif

To edit tabs using the Reorder Tabs icon:
  1. Navigate to the appropriate Page Definition. See "Accessing a Page Definition".
  2. Under Tabs, click the Reorder Tabs icon.
    The Reorder Tabs page appears.
  3. Edit the appropriate information:
    1. Label - Enter a label for the tab.
    2. Page - Enter the page number that corresponds to the tab.
    3. Tab Also Current For - List other pages that also correspond to this tab. To enter multiple pages, enter a list of pages delimited by a comma. For example:
      11,12,13,14,29,14
  4. To change the order in which tabs display, click the up and down arrows in the far right column.
  5. Click Apply Changes.

About the Tabs Page

The Tabs page displays a graphical representation of the tabs defined in your application. You access the Tabs page from the Shared Components page, or by clicking the heading Tabs on the Page Definition.

How to Create a Tab

You create a parent tab or standard tab from the Tabs page.
To create a tab:
  1. Access the Tabs page:
    To access the Tabs page from the Shared Components page:
    1. On the Workspace home page, click the Application Builder icon.
    2. Select an application.
    3. On the Application Builder home page, click Shared Components.
    4. Under Navigation, click Tabs.
    To access the Tabs page from a Page Definition:
    1. Navigate to the appropriate Page Definition. See "Accessing a Page Definition".
    2. Under Shared Components, click the Create icon in the Tabs section.
  2. To create a tab:
    1. Click Add in the appropriate row:
      • Use the Add button in the upper row to add Parent tabs.
        Think of parent tabs as a container to hold standard tabs. For example, to add two levels of tabs, you first create a parent tab and then add standard tabs to it.
      • Use the Add button in the lower row to add Standard tabs.
      The Create Parent Tab or Create Standard Tab Wizard appears.
    2. Follow the on-screen instructions.

Editing Tabs

You can edit multiple tabs simultaneously. Also, for standard tabs, you can update tab properties, such as their labels and order sequence, by using the Standard Tab Tasks list.

Editing Multiple Tabs Simultaneously

You can edit multiple tabs simultaneously.
To edit multiple tabs simultaneously:
  1. Navigate to the Tabs page:
    1. On the Workspace home page, click the Application Builder icon.
    2. Select an application.
    3. Click Shared Components.
    4. Under Navigation, click Tabs.
  2. Click one of the following buttons:
    • Edit Standard Tabs
    • Edit Parent Tabs

Using the Standard Tab Task List

The Standard Tab Task list displays on the right side of the Tabs page. You can access the links on this list to rename a standard tab set, resequence the display order, associate pages with a tab set, create a new standard tab, or create a new standard tab set.
To access the Standard Tab Task list:
  1. Navigate to the Tabs page:
    1. On the Workspace home page, click the Application Builder icon.
    2. Select an application.
    3. Click Shared Components.
    4. Under Navigation, click Tabs.
  2. Make a selection from the Standard Tab Task list:
    • Rename Standard Tab Set
    • Resequence Display Order
    • Associate Page(s) with Selected Standard Tab
    • Create New Standard Tab
    • Create New Standard Tab Set

Accessing Tab Reports

You can view the Tab Utilization and Tab History reports by clicking the appropriate tab at the top of the Tab Manager page.

Standard Tab Utilization

Click Utilization to access the Standard Tab Utilization report. This report lists the standard tabs used in the current application.

Standard and Parent Tab History

Click History to view the Standard Tab History and Parent Tab History reports. These reports display a history of changes to tab attributes for the current application.

Creating Lists

A list is a shared collection of links. You add a list to a page by creating a region and specifying the region type as List. You control the appearance of a list through list templates.
Each list element has a display condition, which enables you to control when it displays. You can define a list element to be either current or non-current for a specific page. You further specify what current looks like using template attributes.
Description of list.gif follows
Description of the illustration list.gif

Topics in this section include:
See Also:
"Creating a New Template" and "List Templates" for information about altering list display

How To Create a List

To add a list to a page in your application, you must:
  1. Create the list using one of these methods:
    • Create a list from scratch by running the Create/Edit Lists Wizard from either the Shared Components page or Page Definition.
    • Copy an existing list. If the list contains list items or entries, the items are also copied.
  2. Add entries to the list:
    • Create list entries from scratch.
    • Copy a single list entry from the current list. This copies the list entry attributes.
    • Copy list entries from another list into the current one. This merges the two sets of list entries without changing the list whose entries are copied into the current one.
  3. Add the list to a page by creating a List region.
Topics in this section include:

Creating a List from Scratch

To create a list:
  1. Access the Create/Edit Lists Wizard:
    To access the wizard from the Shared Components page:
    1. On the Workspace home page, click the Application Builder icon.
    2. Select an application.
    3. On the Application Builder home page, click Shared Components.
    4. Under Navigation, click Lists.
    5. Click Create.
    To access the wizard from a Page Definition:
    1. Navigate to the appropriate Page Definition. See "Accessing a Page Definition".
    2. Under Shared Components, click the Create icon in the Lists section.
  2. In the Create/Edit Wizard:
    1. Name - Enter a name for the list.
    2. List Template - Select a list template.
    3. Build Option - If applicable, select a build option for this component. Build options are predefined settings that determine whether or not components within an application are enabled.
  3. Click Create.

Copying Lists

To copy a list:
  1. Access the Copy List Wizard:
    To access the wizard from the Shared Components page:
    1. On the Workspace home page, click the Application Builder icon.
    2. Select an application.
    3. On the Application Builder home page, click Shared Components.
    4. Under Navigation, click Lists.
    5. Click Copy.
    To access the wizard from a Page Definition:
    1. Navigate to the appropriate Page Definition. See "Accessing a Page Definition".
    2. Under Shared Components, click the Copy icon in the Lists section.
      The Copy icon appears only if a list already exists for this page.
  2. In the Copy Wizard, select the location of the list to copy and click Next.
  3. If you selected List in another application, select the application and click Next.
  4. For Identify List, enter a name for the new list and click Copy.
For the list to appear on a page, you need to add it to the page.

Adding List Entries and Sublists

Once your list is created, you need to add entries to it. You can add list entries from scratch, copy one list entry within a list, or copy existing entries from one list to another.
You can also create hierarchical lists that contain sublists. To create a hierarchical list, you must:
  • Select a list template that supports hierarchical lists. To determine which list templates support hierarchical lists, look for templates having the naming convention "with Sublist."
  • Select a Parent List Item when you create each list entry.
See Also:
"Editing Templates" and "List Templates"
Adding Entries or Sublists from Scratch
To add an entry or sublist from scratch:
  1. Navigate to the Lists page:
    1. On the Workspace home page, click the Application Builder icon.
    2. Select an application.
    3. On the Application home page, click Shared Components.
    4. Under Navigation, select Lists.
      The Lists page appears.
  2. Select a list.
  3. Click Create List Entry.
    The Create/Edit List Entry page appears.
  4. Under Entry:
    1. Parent List Item - Identify the parent for this list entry. Use this attribute if you are creating a hierarchical list that will contain a sublist.
    2. Sequence - Indicate the order in which list entries appear.
    3. Image - Identify the file name for the image used to display this list entry. List templates control this attribute.
    4. Attributes - Identify the image attributes (such as width="12" height="12") for the list element image.
      Use the #LIST_LABEL# substitution string to reference the list label text. This substitution string allows for the title image attribute to be automatically set based on the value of the list label text. For example:
      title="#LIST_LABEL#"
    5. List Entry Label - Enter the label text for this link.
  5. Specify a target location.
    If the target location is a URL, specify the following:
    • Target is a - Select URL.
    • URL Target - Enter a URL. For example:
      http://www.yahoo.com
    If the target location is a page:
    1. Target Type - Select Page in this Application.
    2. Page - Specify the target page number.
      You can also select reset pagination for this page. Selecting this option causes the page to return to the first set of data meeting a user's new query.
      You can also select Printer Friendly. Selecting this option displays the target page using the application's Printer Friendly template. Printer friendly templates optimize a page for printing. "Changing the Default Templates in a Theme" and "Optimizing a Page for Printing".
    3. Request - Specify the request to be used.
    4. Clear Cache - Specify the page numbers on which to clear cache.
    5. To set session state (that is, give a listed item a value):
      • Set these items - Enter a comma-delimited list of item names for which you would like to set session state.
      • With these values - Enter a comma-delimited list of values for the items specified in the previous step.
        You can specify static values or substitution syntax (for example, &APP_ITEM_NAME.). Note that item values passed to f?p= in the URL cannot contain a colon. Additionally, item values cannot contain commas unless you enclose the entire value in backslashes (for example, \1234,56\).
  6. Under Current List Entry:
    1. List Entry Current for Pages Type - Specify when this list entry should be current based on the page type.
      List items can be current or non-current. Current list items use the current template; non-current list items use the non-current list item template. The actual condition and templates are defined in subsequent attributes.
    2. List Entry Current for Condition - Based on the selection above, define a condition to evaluate. When this condition is true, then the list item becomes current.
  7. To make the list entry conditional, specify the appropriate information under Conditions.
  8. Under Authorization, you can specify an authorization scheme.
    This authorization scheme must evaluate to TRUE in order for this component to be rendered or otherwise processed.
  9. Under Configuration, you can select a build option for this component.
    Build options are predefined settings that determine whether or not components within an application are enabled.
  10. Under Click Counting, you can specify if you want the list entries to be included in the click count.
    If this is a link to an external page, such as www.google.com, you can count clicks. For more information, see "COUNT_CLICK Procedure".
  11. To specify additional attributes, use the User Defined Attributes section. For example, the following adds a tabindex and accesskey.
    tabindex="15" accesskey="D"
  12. When you are finished defining list attributes, click Create or Create and Create Another.
Copying List Entries
To copy list entries:
  1. Navigate to the List Entries page:
    1. On the Workspace home page, click the Application Builder icon.
    2. Select an application.
    3. On the Application home page, click Shared Components.
    4. Under Navigation, select Lists.
      The Lists page appears.
    5. On the Lists page, click the name of the list whose entries you want to copy.
      The List Entries page appears.
  2. To copy a single list entry that appears in the current list:
    1. Click the Copy icon in the in the row you want to copy. The Copy icon appears under the Copy column in the list.
      All the attributes of the selected list entry, such as image and parent, will be copied to the new entry.
    2. For Copy List Entry, enter the appropriate information and click Copy List Entry.
  3. To copy list entries from one list to another:
    1. Click Copy List Entries from one List to Another under the Tasks list on the right side of the page.
    2. For Identify Copy Target, select the target list where you want to add the entries and click Next.
    3. For Confirm List Entry Copy, click the Report of New Combined List to review the composite list.
    4. Click Copy List Entries.

Changing Parents of List Entries

To change the parent of list entries:
  1. Navigate to the List Entries page:
    1. On the Workspace home page, click the Application Builder icon.
    2. Select an application.
    3. On the Application home page, click Shared Components.
    4. Under Navigation, select Lists.
      The Lists page appears.
    5. On the Lists page, click the name of the list whose entries you want to update.
      The List Entries page appears.
  2. From the Tasks list on the right, click Reparent List Entries within this List.
  3. On the Reparent List Entries page:
    1. Enter the appropriate information for List and Start With and click Go.
      You can use the Start With field to filter down a large, hierarchical list to pinpoint the entries you need to reparent. You can also use these fields to focus on a subset of a list you want to edit.
    2. For Reparent To, select the new parent for the list entries.
    3. Select the check boxes for the list entries you want to include.
    4. Click Reparent Checked Entries.

Removing Parent of Orphaned List Entries

An orphaned list entry is a list entry whose parent is no longer a member of the current list. When a list entry becomes orphaned, remove the parent entry.
To remove the parent of an orphaned list entry:
  1. Navigate to the List Entries page:
    1. On the Workspace home page, click the Application Builder icon.
    2. Select an application.
    3. On the Application home page, click Shared Components.
    4. Under Navigation, select Lists.
      The Lists page appears.
    5. On the Lists page, click the name of the list whose entries you want to update.
      The List Entries page appears.
  2. From the Tasks list on the right, click Manage Oprhaned List Entries.
  3. On the Manage Orphaned List Entries page:
    1. From the Show list, select Orphaned and click Go.
    2. Select the check boxes for the orphaned list entries.
    3. Click Remove Parent Entry.

Adding a List to a Page

Once you create a list and list entries, the next step is to add it to a page by creating a region and specifying the region type as List.
See Also:
"Creating a New Template" and "List Templates" for information about altering list display
To add a list to a page:
  1. Navigate to the appropriate Page Definition. See "Accessing a Page Definition".
  2. Under Regions, click the Create icon.
  3. For Region, select List as the region type and click Next.
  4. For Display Attributes, specify the appropriate information and click Next:
    • Title - Enter a title for the region. This title will display if the region template you choose displays the region title.
    • Region Template - Choose a template to control the look of the region.
    • Display Point - Identify a display point for this region.
      • Page Template Body - These positions are displayed where indicated by the #BODY# substitution string in the page template.
      • Page Template Region - These positions are controlled by page template substitution strings (#REGION_POSITION_01#..#REGION_POSITION_08#). Page template region positions enable exact placement of a region within a template.
    • Sequence - Specify the sequence for this component. The sequence determines the order of evaluation.
    • Column - Indicate the column where this region is to be displayed. A page can have multiple regions, which can be displayed in different columns. Note that this attribute only applies to regions that are displayed in a Page Template Body position.
  5. For Source, select the list you want to add.
  6. Click Create List Region.
Repeat these procedures for each page where you would like to add a list.

Editing a List

Once you create a list, you can edit it on the Lists page.
To edit a list:
  1. Navigate to the Lists page.
    From the Page Definition:
    1. Navigate to the Workspace home page.
    2. Click the Application Builder icon.
    3. Select an application.
    4. Select a page.
    5. Under Shared Components, click Edit All.
    From the Shared Components page:
    1. Navigate to the Workspace home page.
    2. Click the Application Builder icon.
    3. Select an application.
    4. On the Application home page, click Shared Components.
    5. Under Navigation, click Lists.
  2. On the Lists page, you can change the appearance of the page by making a selection from the View list:
    • Icons (the default) displays each list as a large icon. To edit a list, click the appropriate icon.
    • Details displays each list as a line in a report. To edit a list, click the list name.
  3. Select a list.
    The List Entries page appears.
  4. Select the appropriate list name.
    The Create/Edit List Entry page that appears is divided into sections. You can access these sections by scrolling down the page, or by clicking a navigation button at the top of the page. When you select a button at the top of the page, the selected section appears and all other sections are temporarily hidden. To view all sections of the page, click Show All.
  5. Edit the appropriate attributes.
  6. To learn more about a specific item on a page, click the item label.
    When Help is available, the item label changes to red when you pass your cursor over it and the cursor changes to an arrow and question mark. See "About Field-Level Help".
  7. Click Apply Changes.

Editing Multiple List Entries Simultaneously

You can edit multiple list entries simultaneously by clicking Grid Edit on the List Entries page.
To edit multiple list entries at once:
  1. On the Workspace home page, click the Application Builder icon.
  2. Select an application.
  3. On the Application Builder home page, click Shared Components.
  4. Under Navigation, click Lists.
    The Lists page appears.
  5. Select a list name.
    The List Entries page appears.
  6. Click Grid Edit.
  7. Edit the appropriate items and click Apply Changes.

Accessing List Reports

You can view the List Utilization by Page, Unused Lists, and List History reports by clicking the appropriate tab at the top of the Lists page.
Note:
The List Utilization, Unused Lists, and History buttons only appear after you create a list.

Utilization

Click List Utilization on the Lists page to access the Lists Utilization report. This report displays all lists included in the current application. From the report:
  • To edit list entries, select the list name.
  • To view the pages on which the list appears, click the number in the Pages column.
  • To view the template used with the list, click List Template Utilization. Then click the name to view or edit the list template.

Unused

Click Unused on the Lists page to identify lists that are not used in the current application.

History

Click History on the Lists page to view changes to list definitions and list entries by developer and date.

Creating Breadcrumbs

Breadcrumbs provide users with hierarchical navigation. A breadcrumb is a hierarchical list of links that display using templates. You can display a breadcrumb as a list of links or as a breadcrumb path.
Topics in this section include:
See Also:
"Creating a New Template" and "Breadcrumb Templates"

About Breadcrumbs

A breadcrumb trail indicates where the user is within the application from a hierarchical perspective. In addition, users can click a specific breadcrumb link to instantly view the page. You use breadcrumbs as a second level of navigation at the top of each page, complementing other user interface elements such as tabs and lists.
Description of menu.gif follows
Description of the illustration menu.gif

How to Create Breadcrumbs

You can create breadcrumbs while creating a page, or manually by running the Create Breadcrumb Wizard.
Topics in this section include:

Creating a Breadcrumb While Creating a Page

To create a breadcrumb while creating a page:
  1. Run the Create Page Wizard to add a new page. See "Managing Pages in an Application". You can access this wizard by:
    • Clicking Create Page on the Application home page
    • Clicking Create on the Page Definition
    • Clicking the Create link on the Developer toolbar
    During the wizard, a Breadcrumb list appears. The actual page on which this list displays depends upon the type of page you are creating.
  2. From the Breadcrumb list, select any option other than the following:
    - do not use breadcrumbs on page -
    The Create Breadcrumb Entry form appears.
    Description of breadcrum_creage_pg.gif follows
    Description of the illustration breadcrum_creage_pg.gif

  3. In Entry Name, enter a name for the breadcrumb.
  4. For Parent Entry:
    • To specify a parent, select a parent page from the Select Parent Entry list.
    • If this breadcrumb does not have a parent, select No parent breadcrumb entry.
  5. Follow the on-screen instructions.

Creating a Breadcrumb Manually

To create breadcrumbs manually, you need to add a breadcrumb to each page in your application as follows:
  1. Create the breadcrumb by running the Create/Edit Breadcrumb Wizard from either the Shared Components page or the Page Definition.
  2. Add entries to it.
  3. Add the breadcrumb to a page by creating a region.
Creating Breadcrumbs from the Shared Components Page
To create breadcrumbs from the Shared Components page:
  1. On the Workspace home page, click the Application Builder icon.
  2. Select an application.
  3. On the Application Builder home page, click Shared Components.
  4. Under Navigation, click Breadcrumbs.
    The Breadcrumbs page appears.
  5. Click Create.
  6. Enter a name and click Create.
Creating Breadcrumbs from a Page Definition
To create breadcrumbs from a Page Definition:
  1. Navigate to the appropriate Page Definition. See "Accessing a Page Definition"
  2. Under Shared Components, scroll down to Breadcrumbs and click the Create icon.
  3. For Create, select Breadcrumb and click Next.
  4. Enter a name and click Create.
After you create a breadcrumb, you add entries to it.
Adding Breadcrumb Entries
To add a breadcrumb entry:
  1. Navigate to the Breadcrumbs page:
    1. Navigate to the Workspace home page.
    2. Click the Application Builder icon.
    3. Select an application.
    4. On the Application Builder home page, click Shared Components.
    5. Under Navigation, click Breadcrumbs.
      The Breadcrumbs page appears.
  2. Select a breadcrumb to add entries to.
  3. Click Create Breadcrumb Entry.
  4. Under Breadcrumb, specify the page where this breadcrumb entry will display.
  5. Under Entry:
    1. Sequence - Indicate the order in which breadcrumb entries appear.
    2. Parent Bread Entry - Identify the parent of this entry.
    3. Short Name - Specify the short name of this entry (referenced in the breadcrumb template).
    4. Long Name - Specify the long name of this entry (referenced in the breadcrumb template).
  6. Under Target, specify the target location. The information that appears on the page depends on the branch type you selected:
    1. If the target location is a URL, specify the following:
      • Target is a - Select URL.
      • URL Target - Enter a URL. For example:
        http://www.yahoo.com
    2. If the target location is a page, specify the following:
      • Target is a - Select Page in this Application.
      • Page - Specify the target page number.
        You can also select reset pagination for this page. Selecting this option causes the page to return to the first set of data meeting a user's new query.
      • Request - Specify the request to be used.
      • Clear Cache - Specify the page numbers on which to clear cache.
    3. To set session state (that is, give a listed item a value):
      • Set these items - Enter a comma-delimited list of item names for which you would like to set session state.
      • With these values - Enter a comma-delimited list of values for the items your specified.
        You can specify static values or substitution syntax (for example, &APP_ITEM_NAME.). Note that item values passed to f?p= in the URL cannot contain a colon. Additionally, item values cannot contain commas unless you enclose the entire value in backslashes (for example, \1234,56\).
    4. Click Next.
  7. To make the breadcrumb conditional:
    1. Make a selection from the Condition Type list.
    2. Enter an expression in the fields provided.
  8. Under Authorization, you can specify an authorization scheme.
    This authorization scheme must evaluate to TRUE in order for this component to be rendered or otherwise processed.
  9. Under Configuration, you can select a build option for this component.
    Build options are predefined settings that determine whether or not components within an application are enabled.
  10. When you are finished defining menu attributes, click Create at the top of the page.
Repeat these procedures for each breadcrumb entry you need to create.
Adding a Breadcrumb Region
A region is an area on a page that serves as a container for content. Once you create a breadcrumb and a breadcrumb template, the next step is to create a region. Once you create a region, you can add a breadcrumb to a page.
See Also:
"Creating a New Template" and "Breadcrumb Templates" for information about changing menu display
To create a breadcrumb region:
  1. Navigate to the appropriate Page Definition. See "Accessing a Page Definition".
  2. Under Regions, click the Create icon.
    The Create Region Wizard appears. Note that each wizard page displays a series of blocks on the left, representing the sequence of steps. The highlighted block indicates the step you are performing.
  3. For the region type, select Breadcrumb and click Next.
  4. For Breadcrumb Container Region:
    1. Region Title - Enter a title for this region.
    2. Region Template - Select a region template.
    3. Display Point - Select a Display Point.
      Regions are organized by position (or Display Point). To determine the appropriate region position, click the flashlight icon. A graphical representation appears.
    4. Sequence - Enter a number for the sequence.
    5. Click Next.
  5. For Breadcrumb:
    1. Breadcrumb - Select the breadcrumb to be associated with this region.
    2. Breadcrumb Template - Select a template.
    3. Click Next.
  6. For Breadcrumb Entry, identify the breadcrumb entry used to identify this page:
    1. Breadcrumb Entry Label - Enter a label for the breadcrumb entry.
    2. Parent Breadcrumb Entry - Select the appropriate hierarchical parent.
    3. Click Next.
  7. Click Finish.
Repeat these procedures for each page where you would like to add breadcrumb navigation.
About Creating Dynamic Breadcrumbs
To give users more exact context, you can include session state in breadcrumbs, making your breadcrumbs dynamic. For example, suppose a page in your application displays a list of orders for a particular company and you want to include the following breadcrumb:
Home > Orders > Orders for ACME Inc
In this example, ACME Inc not only indicates the page a user is on but also the navigation path. The Application Express engine stores the value of ACME Inc. in session state.
To create this type of dynamic menu, you must include a reference to a session state item in the breadcrumb's short name or long name. For example:
&COMPANY_NAME.

Editing Breadcrumbs

Once you create a breadcrumb, you can edit it on the Breadcrumbs page.
To edit a breadcrumb:
  1. Navigate to the Workspace home page.
  2. Click the Application Builder icon.
  3. Select an application.
  4. On the Application Builder home page, click Shared Components.
  5. Under Navigation, select Breadcrumbs.
    The Breadcrumbs page appears.
    You can change the appearance of the page by making a selection from the View list and clicking Go:
    • Icons (the default) displays each breadcrumb as a large icon. To edit a breadcrumb, click the icon.
    • Details displays each breadcrumb as a line in a report. To edit a breadcrumb, click the appropriate name.
  6. Select a breadcrumb.
    The Breadcrumb Entries page appears and features two views: Hierarchical View and Tabular View.
  7. Select the appropriate breadcrumb entry name.
    The Create/Edit Breadcrumb Entry page appears.
  8. Edit the appropriate attributes.
    Tip:
    To learn more about a specific item on a page, click the item label. When Help is available, the item label changes to red when you pass your cursor over it and the cursor changes to an arrow and question mark. See "About Field-Level Help".
  9. (Optional) In the Breadcrumb Entry list on the right side of the page, you can select the Synchronize Breadcrumb With Page Name and Title option.
    Selecting this option makes changing the name of a page and breadcrumb a one-step process. The information you provide for breadcrumb names is used to update the referenced page name and title.
  10. Click Apply Changes.

About Navigation Alternatives

The Create/Edit Breadcrumb Entry page is divided into the following sections: Breadcrumb, Entry, Target, Conditions, Authorization and Configuration.
You can access these sections by scrolling down the page, or by clicking a navigation button at the top of the page. When you select a button at the top of the page, the selected section appears and all other sections are temporarily hidden. To view all sections of the page, click Show All.

Reparenting Breadcrumb Entries

You can select a new parent for selected breadcrumb entries on the Reparent Entries page.
To reparent breadcrumb entries:
  1. Navigate to the Breadcrumbs page:
    1. Navigate to the Workspace home page.
    2. Click the Application Builder icon.
    3. Select an application.
    4. On the Application Builder home page, click Shared Components.
    5. Under Navigation, select Breadcrumbs.
      The Breadcrumbs page appears.
  2. Select a breadcrumb.
    The Breadcrumb Entries page appears.
  3. From the Tasks list, click Reparent Entries within this Breadcrumb.
    The Reparent Entries page appears.
  4. Use the navigation bar to edit or filter the view:
    • Breadcrumb - Identify the breadcrumb you wish to edit and click Go.
    • Start With - Make a selection to restrict your view to a subset of the breadcrumb hierarchy and click Go.
  5. From Reparent to, select the new parent.
  6. Select the breadcrumbs entries you wish to move and click Reparent Checked Entries.

Accessing Breadcrumb Reports

You can view the Breadcrumb Utilization and Breadcrumb History reports by clicking the appropriate tab at the top of the Breadcrumbs page.
Note:
The Utilization and History buttons only appear after you create a breadcrumb.

Breadcrumb Utilization Report

Click Utilization to access the Breadcrumb Utilization report. This report lists breadcrumbs by page. Click the page number to go to a specific page.

Breadcrumb History Report

Click History to view the Breadcrumb History report. This report lists recent changes to breadcrumbs.

Creating Trees

You can use a tree in your application to effectively communicate hierarchical or multiple level data.
Topics in this section include:

How To Create a Tree

To create a tree:
  1. Navigate to the Shared Components page:
    1. Navigate to the Workspace home page.
    2. Click the Application Builder icon.
    3. Select an application.
    4. On the Application Builder home page, click Shared Components.
  2. Under Navigation, click Trees.
    The Trees page appears.
  3. Click Create.
    The Create Tree Wizard appears. Note that each wizard page displays a series of blocks on the left, representing the sequence of steps. The highlighted block indicates the step you are performing.
  4. For Page Attributes, enter basic page information and click Next.
    To learn more about a specific item on a page, click the item label. A Help window appears with a description of the item or field.
  5. For Tab, specify how tabs should be implemented and click Next.
  6. For Tree Attributes:
    1. Tree Name - Enter a name.
    2. Default Expanded Levels - Specify the number of default expanded levels.
    3. Start Tree - Specify how you want to determine the starting point. This determines what point in the hierarchy you want to display.
      - Based on New Item with Popup List of Values - Select this option if you want to set up an item containing a list of values. This option enables the user to determine the starting point to display by selecting an option for the list of values.
      - Based on a SQL Query - Select this option if you want to write a query that dynamically finds the starting point of a hierarchy (the entry with no parent).
      - Static Value - Select this option to hard code the starting point.
    4. Click Next.
  7. For Tree Template, select a template and click Next.
  8. For Tree Start, specify a starting point and click Next. Depending on your Start Tree selection, enter either a query or a single value.
  9. For Expand/Collapse, select the buttons to include and click Next.
  10. For Table/View Owner, specify the owner of the table on which the tree will be based and click Next.
  11. For Table/View Name, specify the name of the table on which the tree will be based and click Next.
  12. A tree is based on a query and returns data that can be represented in a hierarchy. This hierarchy is determined by the relationship between ID and Parent ID values. Identify the column you want to use as the ID, the Parent ID, and specify the text that should appear on the leaf nodes.
    1. ID - Enter the column you want to use as the ID.
    2. Parent ID - Enter the Parent ID.
    3. Leaf Node Text - Specify the text that should appear on the leaf nodes.
    4. Link Option - Select Existing Application Item to make the leaf node text a link. If you select this option, specify a page to link to.
  13. Identify an optional where and order by clause to add to your query.
  14. Specify the display text for the Go button.
  15. Identify the page you want to branch to when the user clicks a button.
  16. Click Finish.

Editing a Tree

Once you create a tree, you can edit it on the Trees page.
To edit a tree:
  1. On the Workspace home page, click the Application Builder icon.
  2. Select an application.
  3. On the Application home page, click Shared Components.
  4. Under Navigation, select Trees.
    The Trees page appears.
  5. You can change the appearance of the page by making a selection from the View list:
    • Icons (the default) displays each tree as a large icon.
    • Details displays each tree as a line in a report.
  6. Select a tree.
    The Edit Tree page appears.
  7. Edit the appropriate attributes.
  8. To learn more about a specific item on a page, click the item label.
    When Help is available, the item label changes to red when you pass your cursor over it and the cursor changes to an arrow and question mark. See "About Field-Level Help".
  9. Click Apply Changes.

About Navigation Alternatives

The Edit Tree page is divided into the following sections: Name, Query, Before and After, Static Node Templates, Dynamic Templates, Node Text Templates, and Link Templates.
You can access these sections by scrolling down the page, or by clicking a navigation button at the top of the page. When you select a button at the top of the page, the selected section appears and all other sections are temporarily hidden. To view all sections of the page, click Show All.

Accessing Tree Reports

You can view the Trees Utilization and Tree History reports by clicking the appropriate tab at the top of the Trees page.
Note:
The Utilization and History buttons only appear after you have created a tree.

Tree Utilization

Click Utilization on the Trees page to access the Tree Utilization report. This report displays all trees included in the current application. To edit a tree, select the tree name.

Tree History

Click History on the Trees page to view changes to trees by developer and date.

Creating a Navigation Bar Entry

Navigation bar entries offer an easy way to move users between pages in an application. For example, a navigation entry enables you to display a link from an image or text. The associated page template determines the location of a navigation bar.
Topics in this section include:
See Also:
Customizing Templates

About Navigation Bars

A navigation bar entry can be an image, text, or an image with text beneath it. You must supply the images and text to use in the navigation bar entries.
Description of nav_bar_2.gif follows
Description of the illustration nav_bar_2.gif

Navigation bars are different from other shared components in that you do not need to reference them on a page-by-page basis. If your page template includes the #NAVIGATION_BAR# substitution string, the Application Express engine automatically includes any defined navigation bars when it renders the page.
See Also:
"Supported Page Template Substitution Strings" on using the #NAVIGATION_BAR# substitution string

How to Create a Navigation Bar Entry

Before adding a navigation bar, you must create entries for the navigation bar. To do so, access the Navigation Bar page from either the Page Definition or from the Shared Components page.
See Also:
"Working with Shared Components",
To create a navigation bar entry:
  1. Navigate to the appropriate Page Definition. See "Accessing a Page Definition".
  2. Under Shared Components, scroll down to Navigation Bar.
  3. Under Navigation Bar, click the Create icon.
    The Create Navigation Bar Entry Wizard appears. Note that each wizard page displays a series of blocks on the left, representing the sequence of steps. The highlighted block indicates the step you are performing.
  4. For Attributes, specify the appropriate information:
    1. Sequence - Specify the order of evaluation for this component.
      Tip:
      To review the existing entries, click the Existing Navigation Bar Entries link at the bottom of the page.
    2. Alt Tag Text - Enter ALT text for navigation icons that are images. If you do not specify an image name, then this text displays.
    3. Icon Image Name - Enter an image name. For naming conventions, click the item label (Icon Image Name). This opens item-level help with a list of supported prefixes and examples of image names.
    4. Image Height - Define the height of the image in pixels.
    5. Width - Define the width of the image in pixels.
    6. Text - For text-only entries, enter the entry text. For images, you can also enter additional text to display with the image. This attribute can be translated.
    7. Click Next.
  5. For Target, specify the target location.
    1. If the target location is a URL, specify the following:
      • Target is a - Select URL.
      • URL Target - Enter a URL. For example:
        http://www.yahoo.com
    2. If the target location is a page, specify the following:
      • Target is a - Select Page in this Application.
      • Page - Specify the target page number.
        You can also select reset pagination for this page. Selecting this option causes the page to return to the first set of data meeting a user's new query.
        You can also select Printer Friendly. Selecting this option displays the target page using the application's Printer Friendly template. Printer friendly templates optimize a page for printing. "Changing the Default Templates in a Theme" and "Optimizing a Page for Printing".
      • Request - Specify the request to be used.
      • Clear Cache - Specify the page numbers on which to clear cache.
    3. To set session state (that is, give a listed item a value):
      • Set these items - Enter a comma-delimited list of item names for which you would like to set session state.
      • With these values - Enter a comma-delimited list of values for the items your specified.
        You can specify static values or substitution syntax (for example, &APP_ITEM_NAME.). Note that item values passed to f?p= in the URL cannot contain a colon. Additionally, item values cannot contain commas unless you enclose the entire value in backslashes (for example, \1234,56\).
    4. Click Next.
  6. To set a condition for displaying the navigation bar entry, specify the appropriate conditional information and click Create.

Editing a Navigation Bar Entry

Once you create a navigation bar entry, you can edit it on the Navigation Bar Entries page.
To edit a navigation bar entry:
  1. On the Workspace home page, click the Application Builder icon.
  2. Select an application.
  3. On the Application home page, click Shared Components.
  4. Under Navigation, click Navigation Bar Entries.
    The Navigation Bar Entries page appears. You can change the appearance of the page by making a selection from the View list and clicking Go. Available options include:
    • Icons (the default) displays each navigation bar entry as a large icon. To edit a navigation bar entry, click the icon.
    • Details displays each navigation bar as a line in a report. To edit a navigation bar, click the appropriate sequence number.
  5. Select a navigation bar entry.
    The Edit Navigation Bar Entry page appears.
    The Edit Navigation Bar Entry is divided into the following sections: Sequence, Subscription, Image Attributes, Target, Conditions, Authorization, Configuration, and Comments.
    You can access these sections by scrolling down the page, or by clicking a navigation button at the top of the page. When you select a button at the top of the page, the selected section appears and all other sections are temporarily hidden. To view all sections of the page, click Show All.
  6. Edit the appropriate attributes.
  7. To learn more about a specific item on a page, click the item label.
    When Help is available, the item label changes to red when you pass your cursor over it and the cursor changes to an arrow and question mark. See "About Field-Level Help".
  8. Click Apply Changes.

Editing Multiple Navigation Bar Entries Simultaneously

To edit multiple navigation bar entries simultaneously:
  1. On the Workspace home page, click the Application Builder icon.
  2. Select an application.
  3. On the Application home page, click Shared Components.
  4. Under Navigation, click Navigation Bar Entries.
    The Navigation Bar Entries page appears.
  5. Click Grid Edit at the top of the page.
  6. Edit the appropriate attributes and click Apply Changes.

Using the Reorder Navigation Bar Entries Icon

You can quickly change the order of navigation bar entries by clicking the Reorder Navigation Bar Entries icon on the Page Definition. This icon resembles light green down and up arrows.
Description of reorder_navbar.gif follows
Description of the illustration reorder_navbar.gif

To change the order of the navigation bar entries using the Reorder Tabs icon:
  1. Navigate to the appropriate Page Definition. See "Accessing a Page Definition".
  2. Under Navigation Bar, click the Reorder Navigation Bar Entries icon.
    The Reorder Navigation Bar Entries page appears.
  3. To change the order in which the entries display on this page, click the up and down arrows in the far right column or edit the numbers.
  4. Click Apply Changes.

Accessing Navigation Bar Entry Reports

You can view the Navigation Bar Entry Subscription and Navigation Bar Entry History reports by clicking the appropriate tab at the top of the Navigation Bar Entries page.
Note:
The Subscription and History buttons only appear after you create a navigation bar.

Navigation Bar Entry Subscription Report

Click Subscription to access the Subscribed NavBars report. This report displays subscribed navigation bar entries in your application.

Navigation Bar Entry History

Click History to view the Navigation Bar History report. This report lists recent changes to navigation bars.

Controlling Navigation Using Branches

A branch is an instruction to link to a specific page, procedure, or URL after a given page is submitted. For example, you can branch from page 1 to page 2 after page 1 is submitted.
You create a new branch by running the Create Branch Wizard and specifying the branch point and branch type.
To create a branch:
  1. Navigate to the appropriate Page Definition. See "Accessing a Page Definition".
  2. Under Branches in the Page Processing column, click the Create icon.
  3. For Point and Type, select a branch point:
    • On Submit: Before Computation - Occurs before computations, validations, or processing. Use this option for a Cancel button.
    • On Submit: Before Validation - Occurs after computations, but before validations or processing. Typically not used. If a validation fails, page processing stops, a rollback is issued, and the page displays the error. Because of this default behavior, you do not need to create branches to accommodate validations. However, you might want to branch based on the result of a computation (for example, to the previous branch point).
    • On Submit: Before Processing - Occurs after computations and validations, but before processing. Use this option to branch based on a validated session state, but before performing any page processing.
    • On Submit: After Processing - Occurs after computations, validations, and processing. This option branches to a URL or page after performing computations, validations, and processing. When using this option, remember to sequence your branches if you have multiple branches for a given branch point.
    • On Load: Before Header - Occurs before a page is rendered. This option displays another page, instead of the current page, or redirects the user to another URL or procedure.
  4. Select a branch type and click Next.
  5. For Target, specify the target location. The information that appears on the page depends on the branch type you selected:
    1. If the target location is a URL, specify the following:
      • Target is a - Select URL.
      • URL Target - Enter a URL. For example:
        http://www.yahoo.com
    2. If the target location is a page, specify the following:
      • Target is a - Select Page in this Application.
      • Page - Specify the target page number.
        You can also select reset pagination for this page. Selecting this option causes the page to return to the first set of data meeting a user's new query.
        You can also select include process success message. Selecting this option displays a message when a user submits a page and a branch is taken to another page. If you do not select this option, the message does not display because it is part of submitting the page, not displaying the next one.
      • Request - Specify the request to be used.
      • Clear Cache - Specify the page numbers on which to clear cache. Separate multiple entries with a comma.
    3. To set session state (that is, give a listed item a value):
      • Set these items - Enter a comma-delimited list of item names for which you would like to set session state.
      • With these values - Enter a comma-delimited list of values for the items your specified.
        You can specify static values or substitution syntax (for example, &APP_ITEM_NAME.). Note that item values passed to f?p= in the URL cannot contain a colon. Additionally, item values cannot contain commas unless you enclose the entire value in backslashes (for example, \1234,56\).
    4. Click Next.
  6. Follow the on-screen instructions.
See Also:
"About the When Button Pressed Attribute"
Creating a Branch on a Page with a Component that Submits
If you have a page with a component that submits, such as a Go button or select list with submit, note that you need to create a branch that links back to that page. For example, suppose you have a page with a select list and a submit button. For processing to occur properly, you need to create a branch on the page that links back to the page.
Posted by at
Labels:

No comments:

Post a Comment

Subscribe to: Post Comments (Atom)