I. Overview
1.1 Requirement
In viewing a report, we sometimes need a function that displays the number of rows of data on the current page.
In the Pagination Preview toolbar, there are functions such as Previous, Next and Export, but no number of rows of data on the current page. Here, the function can be achieved by adding custom buttons. The effect is shown below:
1.2 Solution
Fetch the number of rows of data on the current page and the total number of rows of data by adding cell formulas, and then display the numbers on the text of a custom button in the toolbar by adding a Loading End event.
II. Sample
2.1 Make a template
1) Create a new dataset.
2) Select A3, click on the Conditional Formatting icon in the right-hand pane, add a conditional formatting, set attribute to Pagination: Paginate After Row and Type to Formula, input the formula &A3 % 10 = 0 and click Add:
3) Insert the following formula into A1: COUNT({A3}), to count the number of rows of data on the current page:
4) Similarly, insert the following formula into B1: COUNT(A3), to count the total number of rows of data in the report:
Note
The formula in A1 is different from the one in B1 in that it has an extra pair of braces. {A3} means fetching the value of A3 on the current page.
5) Right-click rows 1 and 2 and click Set Repeat Title Rows:
6) Right-click row 1 and click Hide:
2.2 Pagination Preview
1) Click Template>Web Attributes>Pagination Preview and double-click on the Custom Button icon to add it to the toolbar:
2) Add a Loading End event, as shown below:
Input the following JavaScript codes:
var curnum = $("td[id^='A1']").html(); //Fetch the value of A1, i.e., the number of rows of data on the current page
var rownum = $("td[id^='B1']").html(); //Fetch the value of B1, i.e., the total number of rows of data in the report
$('#fr-btn-CustomToolBarButton').text("The current page " + curnum + " data, In total " + rownum + " data");
2.3 Data Entry Settings
To enable data entry pagination, add a custom button in Data Entry Settings and then add a Loading End event:
III. Preview
3.1 Pagination Preview
3.2 Data Entry Preview
To enable Data Entry Preview, append &__cutpage__=v to the URL.
