Business Intelligence Portal > Using a JavaScript Function to Navigate to a Page

Using a JavaScript Function to Navigate to a Page

Topics:

You can use a JavaScript function to dynamically navigate to pages and reports within your portal. This feature is especially useful in portals with multiple pages, because it allows you to link to a specific item or point in your content. You can also pass a parameter from a link to its output, such as a chart or report.

To create the Navigate to Page function, you need to perform the following steps:

  1. Create Hyperlinks in a Report. Create hyperlinks within a report, which you will later configure to point to a page and parameterized content.
  2. Create Parameterized Content. Create charts and reports to which the links will point.
  3. Set Up a Portal for the Navigate to Page Function. Create the landing page for the links.
  4. Configure Hyperlinks. Specify the output location for the links.

Step One: Creating Hyperlinks

How to:

In this step, you will create a simple report with hyperlinks, which you will later configure to point at a specific output in a portal.

Procedure: How to Create Hyperlinks in a Report

  1. Sign-in to WebFOCUS as a developer or administrator.
  2. Right-click a folder, point to New, and then click Report.

    WebFOCUS InfoAssist+ opens.

  3. Select a data source file and click OK.
  4. Drag fields from the Data pane onto the canvas or into the Query pane to create a report.

    For more information on how to create a basic report, see the Creating and Customizing Reports chapter, in the WebFOCUS InfoAssist+ User’s Manual.

  5. Click the field that you want to use for the Navigate to Page function to highlight it.
  6. On the Field tab, in the Links group, click Drill Down.

    The Drill Down dialog box opens.

  7. Select the Refresh BI Portal radio button.
  8. From the Refresh list, click All Pages.
  9. Click the Add Parameter button.
  10. Type a name for the parameter.

    Note: Remember the name of the parameter. You will use it in the subsequent steps.

  11. In the Type list, click Field.
  12. In the Value list, click the field that you have highlighted, and then click OK.

    The following image shows the example of the Drill Down dialog box, where Country is the name of the parameter.

  13. Click OK.

    The hyperlinks are added to the entries of the highlighted field.

    Note: The links remain inactive and evoke no error messages until the target value is configured.

  14. Save the report.

Step Two: Creating Parameterized Content

How to:

In this step, you build parameterized reports and charts that will serve as outputs for your links.

Procedure: How to Create Parameterized Content for Hyperlinks

  1. From InfoAssist+, click the application button, then click New.

    Click Build a Report.

  2. Select the same data source file that you used for the initial report, and then click OK.
  3. Drag fields from the Data pane onto the canvas or into the Query pane to create a report.
  4. On the Data tab, in the Filter group, click Filter.

    The Create a filtering condition dialog box opens.

  5. Double-click the Double-click or press F2 to edit! text.
  6. Set the following values:
    1. In the Field drop-down list, click the same field for which you have created hyperlinks in the previous report.
    2. Keep the Equal To default value.
    3. In the Value dialog box, set Type to Parameter, keep the Simple radio button selected, and type the name of the parameter that matches the parameter in the initial report, select the Optional check box, and then click OK.

    The following image shows an example of the filtering condition, where Country is the name of the parameter.

  7. Click OK.
  8. Save the second report and close WebFOCUS InfoAssist+.
  9. Repeat steps 1-8 to create more content.

Step Three: Setting Up a Portal for the Hyperlinks

How to:

In this step, you will create a landing page for the hyperlinks and incorporate the report that you created in Step Two, to a Portal.

Procedure: How to Set Up a Portal for the Hyperlinks

  1. In the Resources tree, right-click the Portals node, then click New Portal.
  2. Create a new portal, as described in Creating a Portal.

    The Portal Designer opens.

  3. Create a new page and note the Page Name value.

    Note: In a collaborative portal, the Page Name value is displayed in the Add Page window. In a basic portal the Page Name value is displayed in the Properties panel. You can also see the Page Name value in if you hover over any portal in the Resources tree.

  4. Right-click the page canvas, and then click Page Layout.

    The Choose a Layout dialog box opens.

  5. Select the layout type for your page.

    In this example, we select Two Column layout.

  6. Click the first column.
  7. On the Insert tab, in the Containers group, click Panel.

    A Panel container is inserted inside the first column.

  8. Click the container to select it.
  9. In the Properties panel, on the Content tab, view and remember the value of the WebFOCUS Resources field. This value will be used in the subsequent steps.
  10. Repeat steps 7-10 for other columns.
  11. On the Insert tab, in the Content group, click WebFOCUS Resources.

    The Resources tree opens.

  12. Drag the report with hyperlinks to the Page 1 canvas.
  13. Drag the remaining content to the panels on Page 2.

Step Four: Configuring Hyperlinks

How to:

In this step, you edit the report containing hyperlinks to specify the output location.

Procedure: How to Configure Hyperlinks

  1. In the Resources tree, right-click the initial report, point to Edit With, and then click Text Editor.

    The report opens in the Text Editor window.

  2. Navigate to the line that contains the following code: JAVASCRIPT=drillRefresh.
  3. Change drillRefresh to navigateToPage, change AMPERS_PORTAL to the name of the landing page, and specify names of the panels, separated by spaces. Ensure that you enclose these entries in single quotation marks.

    An example of modified syntax should look similar to this:

    JAVASCRIPT=navigateToPage('page1' 'panel1' 'pane2' 'Country' WF_RETAIL_LITE>WF_RETAIL_GEOGRAPHY_STORE_COUNTRY_NAME)

    where:

    navigateToPage

    The JavaScript function.

    page1

    The name of the landing page.

    Note: This value is case sensitive. You can only have one landing page.

    panel1,pane2

    Names of the panels with parameterized content.

    Country

    The name of the parameter that is being passed from the hyperlinks.

    Note: The panels added to this syntax will be refreshed once you click the hyperlink. This behavior can be changed at any time by adding panel names to or removing them from this syntax. This allows you to choose which content gets refreshed on the landing page.

    WF_RETAIL_LITE>WF_RETAIL_GEOGRAPHY_STORE_COUNTRY_NAME

    The database entry which is tied to the parameter alias.

    The following image shows an example of modified syntax.

  4. Click Save and close the Text Editor.
  5. Optionally, customize your portal to achieve the desired style and layout.
  6. Click the Save button and close the Portal Designer.
  7. In the Resources tree, right-click your new portal, and then click Run.
  8. At run time, click any link on the first page of the portal.

    The second page displays, and the content refreshes to show the correct data.

    Note: If you navigate to a page that has changed, you will not receive an error message, and must ensure that your syntax values are set correctly.

    The following images show the Navigate to Page function at run time.

WebFOCUS

Feedback