Menu
Download Free Trial
  1. Getting started
    1. Quickstart
    2. System requirements
    3. Managing license keys
    4. Updating to the latest version
    5. Typical errors
    6. Migration guide from 2.3 to 2.4
    7. Migration guide from 2.2 to 2.3
    8. Installation troubleshooting
  2. JSON data source
    1. Data types in JSON
  3. CSV data source
    1. Data types in CSV
  4. Connecting to SQL database
    1. Connecting to database with .NET
    2. Connecting to database with .NET Core
    3. Connecting to database with Java
    4. Connecting to database with PHP
  5. Connecting to Microsoft Analysis Services
    1. Getting started with Accelerator
    2. Installing Accelerator as a Windows Service
    3. Configuring username/password protection
    4. Configuring secure HTTPS connection
    5. Troubleshooting
  6. Connecting to Pentaho Mondrian
    1. Getting started with Accelerator
    2. Configuring Mondrian roles
    3. Сonfiguring username/password protection
    4. Сonfiguring secure HTTPS connection
    5. Troubleshooting
  7. Connecting to icCube
  8. Configuring report
    1. Data source
    2. Slice
    3. Options
    4. Number formatting
    5. Conditional formatting
    6. Set report to the component
    7. Get report from the component
    8. Date and time formatting
    9. Calculated values
    10. Custom sorting
  9. Integration
    1. Integration with AngularJS
    2. Integration with Angular 2
    3. Integration with Angular 4
    4. Integration with React
    5. Integration with RequireJS
    6. Integration with TypeScript
    7. Integration with ASP.NET
    8. Integration with JSP
    9. Integration with PhoneGap
  10. Integration with charts
    1. Integration with Highcharts
    2. Integration with FusionCharts
    3. Integration with Google Charts
    4. Integration with any charting library
  11. Customizing toolbar
  12. Customizing appearance
  13. Localizing component
  14. Global Object
  15. Export and print
  16. API reference - JavaScript
  17. Documentation 2.3
  18. Documentation 2.2
  19. API reference - Flex
  20. getReportFilters
Table of contents

Export and print

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.

Print

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.

Export to HTML

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);

Export to CSV

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);

Export to Excel

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. Excel only. 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}.

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);

Export to Image

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);

Export to PDF

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).
  • 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);

How to export on the server without using a browser

You can easily export on the server without using a browser by means of PhantomJS. Please find the example on GitHub which includes:

  1. Script file pivot.js for PhantomJS. Usage from the command line:
    phantomjs pivot.js
  2. Pivot component itself with necessary API calls for an export generation in the index.html file.
  3. Very simple save.php sample for generated files saving.