[{"id":"a20f26ac-cd31-4e4d-9454-1e035b0f1587","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"3604b8ce-1da0-413f-8274-7df0f7173573","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"7fce7040-1bb1-4a61-9fb7-2e19d569de50","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"0eb72dd3-8f8f-4039-93a8-500bbde2301e","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"ac046cee-82b9-4edf-a642-ae6d7cb21ebf","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"75b66fd4-b740-443d-bc6e-1782048b60a6","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"dde44832-bb5c-45f3-8ebf-3badbc613cd9","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"43de3664-261b-4cf9-9945-fb519251f4c7","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"2f064d57-b088-4bc5-a628-4e0d7e1a0c65","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"f290406b-ced1-4c52-abad-979160a79f6b","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"1864834b-08ce-43f1-891b-c3cca6e04e95","tags":[{"product":null,"links":null,"id":"4d7b6a40-ab32-4c71-a381-58f3ffd2653e","name":"new","color":"#ed7422","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"f96cfec1-420c-4ca7-ab0a-cab482731073","tags":[{"product":null,"links":null,"id":"4d7b6a40-ab32-4c71-a381-58f3ffd2653e","name":"new","color":"#ed7422","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"3f2ea860-c764-43d8-ae3f-6e3b0314ce67","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"81eb70e8-f770-4384-9167-bc7c755ad052","tags":[{"product":null,"links":null,"id":"4d7b6a40-ab32-4c71-a381-58f3ffd2653e","name":"new","color":"#ed7422","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"d0dff477-9f56-483a-a9fc-cab648905b41","tags":[{"product":null,"links":null,"id":"4d7b6a40-ab32-4c71-a381-58f3ffd2653e","name":"new","color":"#ed7422","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"793a62d7-460d-4699-9304-edb2941268ac","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"2d6ebfad-f7d1-4cc5-8ba1-fdace3472056","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"c8c7b5d5-f5bd-4b68-a12f-3aae9804a844","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"577a09da-dea1-42db-812f-4eeaa9274ece","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"8ddd80d5-886f-41b8-8e3f-f73aa8146c8d","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"e0909540-8bde-4587-bb4d-02445746db2a","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"464b8e03-462d-4aed-8818-05d32ec3bf00","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"f235557b-9781-471f-bf03-38bae6e3e953","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"fd5d021d-0210-4d74-ba42-1a39ef14a385","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"548568fe-dbd1-4da5-a489-d9b3edf75329","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"a0c823ed-e22b-493b-aded-4d201c0fa480","tags":[{"product":null,"links":null,"id":"fe610228-9cf6-417f-813a-dcbfd25406c3","name":"upd","color":"#7e678a","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"d19bc9cd-ff53-4b0d-ab7e-a68c1497c4c6","tags":[{"product":null,"links":null,"id":"4d7b6a40-ab32-4c71-a381-58f3ffd2653e","name":"new","color":"#ed7422","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"94759fce-692f-4779-b5f3-fce5c58f242c","tags":[{"product":null,"links":null,"id":"4d7b6a40-ab32-4c71-a381-58f3ffd2653e","name":"new","color":"#ed7422","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]},{"id":"27658163-a479-432f-a192-dbed286beb3e","tags":[{"product":null,"links":null,"id":"4d7b6a40-ab32-4c71-a381-58f3ffd2653e","name":"new","color":"#ed7422","productId":"d699a6af-e150-4da3-ab30-25fd97934601"}]}]
As we mentioned in the Executing a report section, the result of invoking the run
method of the PageReport
instance is a Promise object fulfilled with the instance of the PageDocument class that allows you to print and export the report output.
The process of printing a report output is achieved by exporting the report to HTML and opening the result in the built-in Print Preview UI of a browser. The print
method of the PageDocument class
facilitates this process and offers the option to include three optional arguments:
renderOptions
– for printing, this can be set to undefined
onProgress
– a callback function that is invoked after each page of the report has been rendered to HTML. It should accept a single number argument that corresponds to the number of pages rendered.
checkCancel
– a callback function that is invoked after each page of the report has been rendered. It should return a boolean value indicating whether the printing process should be halted.
You can utilize these optional arguments, onProgress
and checkCancel
, to implement a custom user interface that displays the progress of the print job and allows for its cancellation in response to certain user events, such as clicking a Cancel
button. The code below prints the report and sends information about the progress to the console.
import {Core} from "@grapecity/activereports";
const report = new Core.PageReport();
await report.load(`assets/Products.rdlx-json`);
const document = await report.run();
document.print(undefined, x=>console.log(`${x} pages ready`), ()=>{
return false;
});
ActiveReportsJS API
allows you to export the report output to PDF
, HTML
or CSV
document providing the PdfExport
, HtmlExport
, and TabularDataExport
objects, respectively. All of them are part of the Core library
.
import {
PdfExport,
HtmlExport,
TabularDataExport,
} from "@grapecity/activereports";
Each export object provides the exportDocument
method with four arguments:
source
– the instance of the PageDocument
class described above.
settings
– settings of the exported document. This argument is specific for each export type:
The PDFExport.exportDocument
accepts the PdfSettings object.
The HtmlExport.exportDocument
accepts the HtmlSettings object.
The TabularDataExport.exportDocument
accepts the TabularDataSettings object.
onProgress
– a callback function that is invoked after each page of the report has been exported. It should accept a single number argument that corresponds to the number of pages exported.
checkCancel
– a callback function that that is invoked after each page of the report has been rendered. It should return a boolean value indicating whether the exporting process should be halted.
The exportDocument
method returns a Promise object that is fulfilled with the result that is specific for each export type:
The PDFExport.exportDocument
fulfills the promise with the PdfExportResult object that allows downloading the result with the download
method or store the result using the data
property of Blob type.
The HtmlExport.exportDocument
fulfills the promise with the HtmlExportResult object that allows downloading the result with the download
method or store the result using the data
property, which is either a string
or Blob
, depending on the value of the multiPage
property of HtmlSettings
.
The TabularDataExport.exportDocument
fulfills the promise with the TabularDataExportResult object that allows downloading the result with the download
method or store the result using the data
property, which is either a string
or Blob
, depending on the value of the outputType
property of TabularDataSettings.csvSettings
.
Below are the code examples for each export type
import {
PdfExport,
HtmlExport,
TabularDataExport,
} from "@grapecity/activereports";
async function exportPdf(document: PageDocument){
const pdfSettings: PdfExport.PdfSettings = {
info: {
title: "Product List"
}
}
const result = await PdfExport.exportDocument(document, pdfSettings);
result.download("products.pdf");
}
async function exportHtml(document: PageDocument){
const htmlSettings: HtmlExport.HtmlSettings = {
title: "Product List",
multiPage: false
}
const result = await HtmlExport.exportDocument(document, htmlSettings);
result.download("products.html");
}
async function exportCSV(document: PageDocument){
const csvSettings: TabularDataExport.TabularDataSettings = {
csvSettings: {
colSeparator: ","
}
}
const result = await TabularDataExport.exportDocument(document, csvSettings);
result.download("products.csv");
}
async function onExport(){
const report = new Core.PageReport();
await report.load(reportUrl);
var document = await report.run();
exportHtml(document);
exportCSV(document);
exportPdf(document);
}