JS Get the Values of Certain Cells in Rows with Checked Box-FineReport Help Document

Last update： 2020-12-16

I. Overview

1.1 Requirement

How to get the values of certain cells in rows with checked checkboxes in a data entry template?

1.2 Solution

By clicking the Check button, you can get the cell with the checked checkbox (td), then get the row with the checked checkbox (tr), and finally get the values of the cells of Region, Sale Volume and Income in the selected rows. Save these values in the pre-defined data array, so that you can refer to required data by referring to the final data array.

You are provided with the following steps to get the cell with the checked checkbox in the template with or without freeze settings.

II. Sample

2.1 Template without freeze settings

1) The template is designed as follows:

2) Add a checkbox to the left of the expanded data, namely, in A3. Set A3 as the parent cell of B3. In this way, there will be a checkbox on the left of each row.

3) Settings of B4 are as follows: [Select Widget: Button], [Button Type: Common] and [Widget Name: Check]. Then add a click event to the button widget.

Input the following JS codes:

var products = []; 
var ordernums = []; 
var ordernums1 = []; 
var $span = $('.fr-checkbox-checkon');  // Get the checked checkbox
var $tds = $("td").has($span);  // Get the cell with checked checkbox, namely, the cell selected
var $trs = $("tr").has($tds);   // Get the row of the selected cell
for(var i = 0 ; i < $trs.length ; i++){
    var product = $("td:eq(2)",$($trs[i])).html();   // Get the value of C3
    products.push(product);     //Put the selected cell value into the data array
    var ordernum = $("td:eq(3)",$($trs[i])).html();   // Get the value of D3
    ordernums.push(ordernum);
    var ordernum1 = $("td:eq(6)",$($trs[i])).html();  // Get the value of G3
    ordernums1.push(ordernum1);
}
alert(products + "\n" + ordernums + "\n" + ordernums1);

4) Save the template and click [Data Entry Preview]. Select several rows and click the Check button, then the value of the selected cells will pop up, as shown in the figure below:

2.2 Template with freeze settings

1) Open the ready-made template, click [Template]＞[Duplicate and Freeze], and configure desired settings in the [Data Entry Freeze], as shown in the figure below:

2) Click the button widget of B4 to modify its click event.

Input the following JS codes:

var products = []; 
var ordernums = []; 
var ordernums1 = []; 
var $span = $('.fr-checkbox-checkon'); 
var $tds = $("td").has($span);    
var $trs = $("tr").has($tds); 
for(var i=1; i<$trs.length;i++){
     var row = $("td:eq(0)",$($trs[i])).attr("row");
     products.push(contentPane.getCellValue(2,row));
     ordernums.push(contentPane.getCellValue(3,row));
     ordernums1.push(contentPane.getCellValue(6,row));
}  
alert(products + "\n" + ordernums + "\n" + ordernums1);