Custom File Name Based on the Selected Value by JS

Problem

By default, the file name of an exported report is the same as the template name. You can change the file name by modifying the title under Template > Web Attribute > Basic. How can you make the exported file name change dynamically based on the value selected in the drop-down box widget?

Implementation Method

Method One: Customize the exported file name by setting the title under Template > Web Attribute > Basic.

Method Two: Modify the exported file name using the __filename__ parameter in the JavaScript codes in the Click event of the export button.

Method One

1. Open GettingStartedEN.cpt in the %FR_HOME%\webroot\WEB-INF\reportlets path.

2. Modify the SQL statement in dataset ds1 to SELECT * FROM Sales_Volume where region='${Region}'.

3. Choose Template > Template Parameter on the menu bar, and add the template parameter Date.

4. Choose Template > Web Attribute > Basic on the menu bar, and enter ${Region+"_Region_"+Date} in Title.

5. Modify the template title to the dynamic title "Sales in " + $Region.

6. Enter the parameter panel, delete the Query button, and modify Widget Name of the drop-down box widget to Region.

7. Add a label widget to the parameter panel and set Widget Value to Region:. Add a date widget, modify Widget Name to Date, set Widget Value to Formula, enter TODAY(), and click OK.

8. Add After Adding events to the drop-down box widget Region and the date widget Date to achieve an automatic query.

The JavaScript code is as follows.

_g().parameterCommit();

9. Add a button widget and modify Button Name to Export, and add a Click event.

The JavaScript codes are as follows.

Note:

1.  The value Custom File Name by JS - Method 1.cpt in ${servletURL}?viewlet=Custom File Name by JS - Method 1.cpt is not fixed and should be modified according to the actual name and storage location of the template.

2.  Region and Date are parameter names. By default, the export is performed on the current page.

var Region = _g().getParameterContainer().getWidgetByName("Region").getValue(); 
var Date = _g().getParameterContainer().getWidgetByName("Date").getValue(); 
var REPORT_URL = '${servletURL}?viewlet=Custom File Name by JS - Method 1.cpt&Region=' + Region + '&Date=' + Date + '&format=excel'; 
window.location = (encodeURI(encodeURI(REPORT_URL)));

10. Click the blank area on the parameter panel and deselect Display Nothing Before Query on the right attribute panel.

Method Two

1. Perform additional modifications based on the previous section. Clear the content in Title under Template > Web Attribute > Basic.

2. Select the Export button, and edit the Click event by modifying the JavaScript codes.

The JavaScript codes are as follows:

Note:

The value Custom File Name by JS - Method 2.cpt in ${servletURL}?viewlet=Custom File Name by JS - Method 2.cpt is not fixed and should be modified according to the actual name and storage location of the template.

var Region = _g().getParameterContainer().getWidgetByName("Region").getValue(); 
var Date = _g().getParameterContainer().getWidgetByName("Date").getValue(); 
var name = Region + "_Region_" + Date; 
var REPORT_URL = '${servletURL}?viewlet=Custom File Name by JS - Method 2.cpt&Region=' + Region + '&Date=' + Date + '&format=excel' + '&__filename__=' + name; 
window.location = (encodeURI(encodeURI(REPORT_URL)));

Preview Effect

Save the template and click Pagination Preview. The following figure shows the preview effect on the PC.

Note:

Templates cannot be printed or exported on mobile terminals.

Method One

For details, you can download the template Custom File Name by JS - Method 1.cpt.

Method Two

For details, you can download the template Custom File Name by JS - Method 2.cpt.