JS Confirm Before Delete Row

1.1 Requirement

When users perform row-based data entry, FineReport will provide users with the following effect, namely, when users click the [Delete Row] button, the dialog box “If you confirm to delete the row” pops up. If users click [Yes], the data will be deleted and the [Submit a Loading Event] will be executed. If users click [Cancel], no action will be executed.

1.2 Solution

Use the [Delete Row] button to add a Click Event. Execute different actions by inputting the JS code to get different return values.

2.1 Create a template

Design a template as follows:

2.2 Add widgets

Choose H3, click Attribute Setting>Widget Setting on the right pane to add a [Button Widget] and set the Button Type as [Delete Row]. Set the [Specify Cell] as A3, as shown below:

2.3 Add a click event

Choose H3. Click Attribute Setting>Widget Setting>Event on the right pane to add a Click Event, as shown below:

Input the JS code:

if(confirm("Are you sure to delete?"))   //The dialog box “If you confirm to delete the row” pops up.
{
  setTimeout(function() {
     _g('${sessionID}').writeReport();   //Execute [Submit a Loading Event] action.
  }, 2000);
  return true;    //If users click [Yes], the return value is true, and above actions will be executed.
}else{
   return false; //If users click [Cancel], the return value is false, and above actions will not be executed.
}

2.4 Preview

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

Note

The default action of [Delete Row] is deleting the selected row in the page and then executing [Submit a Loading Event]. As a result, when the data are deleted, there is a two-second delay before the execution of [Submit a Loading Event].

1.cpt