JS Sets Widget Focus

1.1 Requirement

In making a report, sometimes the Text widget is disabled by default and can only be enabled by clicking a certain button.

As shown below, the Text widget is disabled by default, but by clicking Edit, it becomes enabled and you are allowed to type texts in the textbox.

1.2 Solution

Add a Click event to enable the Button widget.

2.1 Settings of template attributes

Click [Template]-[Web Attributes]-[Data Entry Settings], select [Individually set for the report], and check [Visible Widget].

2.2 Style

1) Add a Text widget and a Button widget as shown below:

2) Name the Text widget [text] and uncheck [Enabled] by default:

3) Name the Button widget [edit]and click the Event tab to add a Click event, as shown below:

2.3 JavaScript codes

2.3.1 Method 1

Edit the Click event by typing the following JavaScript codes:

var self =contentPane.getWidgetByName("test"); // Get the Text widget named test
self.setEnable(true);// Set the Text widget to Enable
var myFocusID = setInterval(
 function() 
 { 
   self.editComp.focus(); // Set the cell in editing mode
 }, 20);

Note: Method 1 requires checking [Visible Widget], otherwise the widget is only editable but will not automatically become the focus.

2.3.2 Method 2

Input the following JavaScript codes:

var self =contentPane.getWidgetByName("test"); 
self.setEnable(true);
var cell = contentPane.curLGP.getTDCell(1,1);// Get the focused cell object getTDCell(1,1) , namely, B2
setTimeout(
function()
{
contentPane.curLGP.selectTDCell(cell);//Select a cell
setTimeout(
function(){
contentPane.curLGP.editTDCell(cell); // Set the cell in editing mode
},20);
},20)

2.4 Preview

Save the template and click [Data Entry Preview]. The preview effect on a PC is shown as below:

3.1 Template for Method 1

1.cpt

3.2 Template for Method 2

2.cpt

Refer to the original link: https://help.finereport.com/doc-view-1781.html