[General] Returning to the Original Page After Data Drilling by JS

Expected Effect

When using a paginated report on the mobile terminals, you may want to return to the original page to continue browsing after drilling down to other reports. The following figure shows the effect.

Implementation Method

You can jump between the two templates by adding hyperlinks to the two templates.

This document introduces the implementation process.

Main Template Creation

Data Preparation

Create a template dataset named ds1 with the SQL statement SELECT * FROM Sales_Volume.

Report Design

1. Design the table and drag the fields into the corresponding cells, as shown in the following figure.

2. Choose Template > Repeat/Freeze, set Repeat Title Row to From No.1 Row to No.2 Row, and set Repeat Last Row to From No.4 Row to No.4 Row.

3. Set five rows of data to be displayed on one page. Select cell B3, click Condition Attribute, select Pagination from the drop-down list of Attribute, select Paginate After Row from the drop-down list of Pagination, and add the pagination condition seq() % 5 == 0 in the Formula box.

4. To add serial numbers to the data, add the formula &B3+"." for cell A3 to display the serial numbers.

Set Left Parent Cell of cell A3 to B3 and set Left Parent Cell of cell B3 to None.

5. To set the display format of data, set Data Setting to List for cell B3.

6. To add page numbers to the footer rows, add the formula "The " + $$page_number + " page" for cell F4 to display page numbers.

7. Save the template and name the template Page Jump Test on the Mobile Terminals.

Sub-template Creation

Choose File > Saved As for the template Page Jump Test on the Mobile Terminals and rename the template Page Jump Test on the Mobile Terminals-Subpage.

Modifying the Dataset for the Sub-template

SELECT * FROM Sales_Volume

where Region='${region}' and Salesperson='${sales}' and Product='${product}'

Adding a Return Button

Add a parameter for cell G1 with the value set in the form of the formula $page. Click the icon next to Add Condition, set Column Width to 0 mm with no condition for cell G1.

Add a Hyperlink to the Return Button

Add the text <Back for cell B1 of the sub-template, and add a JS script hyperlink for cell B1. Add the parameter page and set Value to the formula G1 in the JS script.

The JS code is as follows:

var url = encodeURI("${servletURL}?viewlet=/Page Jump Test on the Mobile Terminal.cpt&page="+page);
FR.doHyperlinkByGet({url:url,title:'Page Jump Test on the Mobile Terminal',target:'_self'});//Click the hyperlink of the cell to open the Page Jump Test on the Mobile Terminal template and pass the value of the parameter page.

Main Template Setting

Hyperlink Adding

Return to the Page Jump Test on the Mobile Terminal report, and add a Web Report hyperlink for cell C3. The following figure shows the specific setting.

Adding a Loading End Event

Choose Template > Web Attribute and add a Loading End event in Pagination Preview Setting, as shown in the following figure.

The JS code is as follows:

var ye='${=$page}'
if(ye){
contentPane.gotoPage(parseInt(ye))}//Jump to the specified page.

For details about the display effect on mobile terminals, see section "Expected Effect."

For details, you can download the template Page Jump Test on the Mobile Terminal.cpt.

For details, you can download the template Page Jump Test on the Mobile Terminal-Subpage.cpt.