How to generate PDF files through JavaScript functions

Time:2021-9-18

The front end often needs to export the existing data display results into PDF files, and supports saving the designed reports as PDF, xlsx and HTML files. You can also export the report directly without preview.

Add export function in pure JavaScript applications
To export the report file to which format, you need to import relevant JS files, as follows:

<script></script>
<script></script>
<script></script>

If you need to set some export properties at runtime, you can refer to the export API. The export code is as follows:

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

The second parameter in the constructor of activereports.viewer accepts the vieweroptions object, which can set the exportssettings property. You can use to preset default values for each supported export format.

Export directly without preview
Activereportsjs provides the exportdocument method in pdfexport, HTMLexport and xlsxexport. The following code demonstrates how to load, run, export and download the export file from the report:

import { Core, PdfExport } from "@grapecity/activereports";

const pdfExportSettings: PdfExport.PdfSettings = {
  title: "Test document",
  author: "GrapeCity",
  keywords: "export, report",
  subject: "Report",
  pdfVersion: "1.4",
};

const report = new Core.PageReport();
await report.load("/reports/text-only.rdlx-json");
const doc = await report.run();
const result = await PdfExport.exportDocument(doc, pdfExportSettings);
result.download("exportedreport.pdf");