Change the Background of a Cell in the Row Where the Checkbox is Located

1.1 Problem description

When filling a form, after checking the checkbox, change the background color of a cell in the row where the checkbox is located.

1.2 Implementation ideas

Add a State Change event to the checkbox widget to change the background color of the specified cell.

2.1 Open the report

Open the report %FR_HOME%\webapps\webroot\WEB-INF\reportlets\demo\data entry\batch deletion.cpt.

2.2 Modify the report

Right-click A3, clear the original widget in the cell, and set the left parent cell of cell B7 to C7.

Set the widget for A3, select the checkbox widget as the widget type, add a State Change, add a parameter named row and the parameter value is the formula: row(), as shown in the following figure:

JS code:

var value = this.getValue();
if(value)
{
$('td[id^=H'+row+'-0-0]').css({'background-color':'yellow'});//When the checkbox is checked, in the current row, the background color of the cell in column H turns yellow
}
if(!value)
{
$('td[id^=H'+row+'-0-0]').css({'background-color':'white'});//When the check box is not checked, in the current row, the background color of the cell in column H becomes white
}

Note: When there are horizontally expanded data columns in the report, please note that the H in $('td[id^=H'+row+'-0-0]') is column H after expansion during the preview rather than column H in the designer.

2.3 Preview effect

Save the template, click Data Entry Preview, and the effect on the PC side is as follows:

Note: The JS codes doe not support mobile devices.

Batch Deletion.cpt