[]
DEMO DOCS API
DOWNLOAD
(Showing Draft Content)

Export reports

Supported Export Methods

ActiveReportsJS provides built-in functionality for exporting reports to PDF, Excel, Tabular Data, and HTML formats. The Report Viewer UI includes a configurable Export Sidebar, which allows report readers to select an output format and adjust export options. Additionally, the ActiveReportsJS API provides programmatic methods for exporting reports without loading them in the viewer.

Configuring the Export Sidebar in Pure JavaScript Applications

To enable export functionality, include the following script files in your application:

<script src="https://cdn.mescius.com/activereportsjs/6.latest/dist/ar-js-pdf.js"></script>
<script src="https://cdn.mescius.com/activereportsjs/6.latest/dist/ar-js-xlsxAdv.js"></script>
<script src="https://cdn.mescius.com/activereportsjs/6.latest/dist/ar-js-tabular-data.js"></script>
<script src="https://cdn.mescius.com/activereportsjs/6.latest/dist/ar-js-html.js"></script>

Each script enables the corresponding export format in the Export Sidebar.

To configure which export formats are available at runtime, use the availableExports property. For example, the following code initializes a Report Viewer instance and enables only the PDF export option:

var viewer = new MESCIUS.ActiveReportsJS.ReportViewer.Viewer("#viewer-host");
viewer.availableExports = ["pdf"];

Supported values for the availableExports property:

Export Type

Property Value

PDF

"pdf"

Excel (XLSX)

"xlsxAdv"

Tabular Data

"tabular-data"

HTML

"html"

You can also preset default export options using the ExportsSettings property of the ViewerOptions object. See the Export Settings page for detailed instructions.

For more information about using ActiveReportsJS in pure JavaScript applications, refer to the Pure JavaScript documentation.

Configuring the Export Sidebar in Angular Applications

For Angular projects, refer to the Angular Component documentation for details on enabling export services.

At runtime, you can:

  • Use the availableExports property to define the list of enabled export formats.

  • Use the exportsSettings property to set default export options.

See the Export Settings page for details.

Configuring the Export Sidebar in React, Svelte and Vue Applications

In React, Svelte and Vue applications, the ActiveReportsJS Report Viewer component automatically enables the Export Sidebar when any type from the @grapecity/activereports package is imported.

At runtime, you can configure export behavior using the following component properties:

  • availableExports — defines which export formats are available in the Export Sidebar.

  • exportsSettings — presets default export settings for each format.

Refer to the Export Settings page for details on configuring export options.

For framework-specific setup instructions, see: