All current data from the grid or chart can be exported in various formats. It is an easy and convenient way to save the results of your work. The file can be saved to the local file system or to your server.
API call exportTo() is used for exporting and API call print() is used for printing.
Printing of the content of the grid or chart via OS print manager can be configured with the following parameters object inside print() call:
options (optional) – Object. Can contain the following print properties:
header (starting from v2.211) (optional) – String. Header is set in HTML format (tags, inline styles, img with base64 src), rendered in the browser and added as an image to the printed PDF file. The following tokens can be used: ##CURRENT-DATE##, ##PAGE-NUMBER##. They will be replaced by appropriate data.footer (starting from v2.211) (optional) – String. Footer is set in HTML format (tags, inline styles, img with base64 src), rendered in the browser and added as an image to the printed PDF file. The following tokens can be used: ##CURRENT-DATE##, ##PAGE-NUMBER##. They will be replaced by appropriate data.Below is an example with header and footer parameters:
var options = {
header:"<div>##CURRENT-DATE##</div>",
footer:"<div>##PAGE-NUMBER##</div>"
}
flexmonster.print(options);
Check out how this sample works on JSFiddle.
For exporting to HTML you should set the first parameter of exportTo() to "html".
The second parameter is optional. This is the object which can contain the following properties:
filename (optional) – the name of the resulting file. The default name is "pivotgrid".destinationType (optional) – defines where the component’s content will be exported. Destination type can be the following:"file" (by default) – the component’s content will be exported to the file to the local computer."server" – the component’s content will be exported to the server (a server-side script is required).footer (starting from v2.211) (optional) – String. Footer is set in HTML format (tags, inline styles, img with base64 src). The following token can be used: ##CURRENT-DATE##. It will be replaced by appropriate data.header (starting from v2.211) (optional) – String. Header is set in HTML format (tags, inline styles, img with base64 src). The following token can be used: ##CURRENT-DATE##. It will be replaced by appropriate data.url (optional) – to save the file to the server you should provide the component with a path to the server-side script which can save this file.The third parameter is optional. It is callbackHandler which gets the following object: {data: result}.
Here is how to save in HTML format as a local file:
var params = {
filename: 'flexmonster'
};
flexmonster.exportTo('html', params);
Try the example on JSFiddle.
Saving to server:
var params = {
destinationType: 'server',
header:"<div>Table One</div>",
footer:"<div>##CURRENT-DATE##</div>",
url: 'your server-side script'
};
flexmonster.exportTo('html', params);
For exporting to CSV you should set the first parameter of exportTo() to "csv".
The second parameter is optional. This is the object which can contain the following properties:
filename (optional) – the name of the resulting file. The default name is "pivot".destinationType (optional) – defines where the component’s content will be exported. Destination type can be the following:"file" (by default) – the component’s content will be exported to the file to the local computer."server" – the component’s content will be exported to the server (a server-side script is required).url (optional) – to save the file to the server you should provide the component with a path to the server-side script which can save this file.The third parameter is optional. It is callbackHandler which gets the following object: {data: result}.
Here is how to save in CSV format as a local file and get the resulting data within callbackHandler:
var params = {
filename: 'flexmonster'
};
flexmonster.exportTo('csv', params,
function(result) {console.log(result.data)}
);
Open the example on JSFiddle.
Saving to server:
var params = {
destinationType: 'server',
url: 'your server-side script'
};
flexmonster.exportTo('csv', params);
For exporting to Excel you should set the first parameter of exportTo() to "excel".
The second parameter is optional. This is the object which can contain the following properties:
filename (optional) – the name of the resulting file. The default name is "pivot".destinationType (optional) – defines where the component’s content will be exported. Destination type can be the following:"file" (by default) – the component’s content will be exported to the file to the local computer."server" – the component’s content will be exported to the server (a server-side script is required).excelSheetName (starting from v2.2) (optional) – String. To configure the sheet name when exporting to Excel file.showFilters (starting from v2.1) (optional) – Boolean. Indicates whether the filters info will be shown (true) in exported Excel file or not (false). Default value is false.url (optional) – to save the file to the server you should provide the component with a path to the server-side script which can save this file.useOlapFormattingInExcel (starting from v2.2) (optional) – Boolean. To configure how to export grid cells in Excel file if formatting is taken from OLAP cube – as a formatted string (true) or as numbers without formatting (false). Previously it was not configurable and the cells were exported as formatted strings.The third parameter is optional. It is callbackHandler which gets the following object: {data: result}.
Also, you can add custom fields which will be displayed in exported Excel table. This can be done by defining customFields property in your report. For more details please check an example.
Here is how to save in Excel format as a local file:
var params = {
filename: 'flexmonster',
excelSheetName: 'Report',
showFilters: true,
useOlapFormattingInExcel: false
};
flexmonster.exportTo('excel', params);
Check out the example on JSFiddle.
Saving to server:
var params = {
destinationType: 'server',
url: 'your server-side script'
};
flexmonster.exportTo('excel', params);
For exporting to image you should set the first parameter of exportTo() to "image".
The second parameter is optional. This is the object which can contain the following properties:
filename (optional) – the name of the resulting file. The default name is "pivotgrid".destinationType (optional) – defines where the component’s content will be exported. Destination type can be the following:"file" (by default) – the component’s content will be exported to the file to the local computer."server" – the component’s content will be exported to the server (a server-side script is required).url (optional) – to save the file to the server you should provide the component with a path to the server-side script which can save this file.The third parameter is optional. It is callbackHandler which gets the following object: {data: result}.
Here is how to save image as a local file:
var params = {
filename: 'flexmonster'
};
flexmonster.exportTo('image', params);
Try the example on JSFiddle.
Saving to server:
var params = {
destinationType: 'server',
url: 'your server-side script'
};
flexmonster.exportTo('image', params);
For exporting to PDF you should set the first parameter of exportTo() to "pdf".
The second parameter is optional. This is the object which can contain the following properties:
filename (optional) – the name of the resulting file. The default name is "pivot".destinationType (optional) – defines where the component’s content will be exported. Destination type can be the following:"file" (by default) – the component’s content will be exported to the file to the local computer."server" – the component’s content will be exported to the server (a server-side script is required)."plain" – only for PDF export. This destination type allows modification of generated PDF file. The component’s content will be exported to the jsPDF object and returned with callbackHandler. jsPDF is a library which generates PDFs in client-side JavaScript. After export from Flexmonster, jsPDF object can be modified using jsPDF API and then saved. See the example.footer (starting from v2.211) (optional) – String. Footer is set in HTML format (tags, inline styles, img with base64 src), rendered in the browser and added as an image to the exported PDF file. The following tokens can be used: ##CURRENT-DATE##, ##PAGE-NUMBER##. They will be replaced by appropriate data.header (starting from v2.211) (optional) – String. Header is set in HTML format (tags, inline styles, img with base64 src), rendered in the browser and added as an image to the exported PDF file. The following tokens can be used: ##CURRENT-DATE##, ##PAGE-NUMBER##. They will be replaced by appropriate data.pageOrientation (optional) – defines the page orientation for a PDF file. Page orientation can be the following:"portrait" (by default) – defines portrait page orientation for a PDF file."landscape" – defines landscape page orientation for a PDF file.url (optional) – to save the file to the server you should provide the component with a path to the server-side script which can save this file.The third parameter is optional. It is callbackHandler which gets the following object: {data: result}.
Here is how to save in PDF format as a local file:
var params = {
filename: 'flexmonster',
header:"<div>##CURRENT-DATE##</div>",
footer:"<div>##PAGE-NUMBER##</div>",
pageOrientation: 'landscape'
};
flexmonster.exportTo('pdf', params);
Check out the example on JSFiddle.
Saving to server:
var params = {
destinationType: 'server',
url: 'your server-side script'
};
flexmonster.exportTo('pdf', params);
Modifying generated PDF and saving locally:
flexmonster.exportTo("pdf", { destinationType: "plain" }, function(res) {
var pdf = res.data;
pdf.addPage();
pdf.text('Hello world!', 10, 10);
pdf.save(res.filename);
});
You can easily export on the server without using a browser by means of PhantomJS. Please find the example on GitHub which includes:
pivot.js for PhantomJS. Usage from the command line:phantomjs pivot.js
index.html file.save.php sample for generated files saving.