JS Get cell value in Pagination Report

1.1 Problem

Pagination preview reports can only be used to display data. Sometimes we also need to get the values of certain cells in the report for other operations. In the example below, we have obtained the value of a cell and then modified it, as shown below:

1.2 Solution

1) Solution 1

When accessing a cpt template, the report Servlet will parse the cpt file into the corresponding HTML, and the report content is finally converted into a table, located in the div of id=content-container.

Since the pagination preview is only for display, we can use jQuery syntax to obtain the specified cell.

$("tr[tridx=row number]","div.content-container").children().eq(col number)

Note: row/col number starts from 0.

2) Solution 2

After the page is loaded, the main report body is a table object, and each cell corresponds to a td object, which contains the id attribute that controls the location of the cell. The format is A1-0-102, where A1 is the table cell code. You need to use the matching symbol ^= in front of the jQuery object property to get the cell td object, then you can get the specified cell, and use the text() method provided by jQuery to get and set the value of the cell. 

$("td[id^=Cell code-")

Note: The cell code is similar to the cell number in the template design, such as A1, D5, etc., A1 corresponds to the first row and the first column, and D5 is the fifth row and the fourth column.

Open the template %FR_HOME%\webroot\WEB-INF\reportlets\doc-EN\Advanced\BetweenCellOperation\Column-wise_Running_Total .cpt

Click Template>Template Web Attributes , click Pagination Preview Settings, and add a loading end event.

2.1 Solution 1

1) JavaScript

var a = $("tr[tridx=2]","div.content-container").children().eq(0).html();
alert("The value of row 3, column 1 is："+a);
$("tr[tridx=2]","div.content-container").children().eq(0).html(2020);
alert("The value of row 3, column 1 is changed to 2020");

Note: The rows and column numbers here are those after the cell is expanded

2) Preview effect

2.2 Solution 2

1) JavaScript

var a = $("td[id^=A3-]").text();
alert("A3 cell value is：" + a);
$("td[id^=A3-]").text(2020);
alert("The value of cell B3 is changed to 2020");

Note: The cell code here is that after the cell is expanded

2) Preview effect

3.1 Solution 1

Column-wise_Running_Total_1.cpt

3.2 Solution 2

Column-wise_Running_Total_2.cpt