JS Predefine an Export Button-FineReport Help Document

Last update： 2020-12-28

I. Overview

1.1 Problem Description

The built-in export button in the toolbar do not support customizing the name of the exported file. You can use JS to customize the name just like the method in JS Customize Export File Name.

However, if many templates need to implement this function, it is better to set a predefined export button which can be used by all templates. How to achieve this？

1.2 Solution

1) Traverse the widgets in the parameter pane to obtain the corresponding parameter values.

2) Obtain the path of the corresponding template through parameters named servletURL and reportName.

II. Steps

2.1 Create a new widget and add attributes

1) Select Server > Widget Manager.

2) Follow the steps to add a button

Click to add a new widget
Double click to modify widget name to export
Set widget type to Button
Button type is Common and button name is Export

image (2).png

3) Click Event, add parameters and JS codes, and click OK.

image (3).png

Parameters are as follows：

servletURL: servletURL

reportName: reportName

exportName: indexofarray(split(indexofarray(REVERSEARRAY(split(reportName,"/")),1),".c"),1)+"_"+format(now(),"yyyyMMddHHmm")

Tips: The default export file name implemented by this code is: template name_export time, which is determined by exportName. Here you can customize the export name by changing the parameter value.

The JS code is：

var url=servletURL+"?viewlet="+reportName;
$.each(this.options.form.name_widgets,function(i,item) {
      if(item.options.type!== 'label'&&item.getName()!="PARA"&&item.getName()!="SEARCH"&&item.getName()!="EXPORT") {
      url+="&"+item.getName()+"="+item.getValue();
    }
});
url+="&format=excel&extype=simple&__filename__="+exportName;
window.location=(FR.cjkEncode(url));

2.2 Add the cusomized button to parameter pane

Edit the parameter pane. In the toolbar, click on the small triangle and you will see the customized export button. Press and hold it to drag it to the parameter pane.

image (4).png