The Grid provides options for exporting its content to PDF.
To enable the PDF export, import the PDFModule and add the kendo-grid-pdf component to the Kendo UI Grid for Angular. To initiate the PDF export, use the kendoGridPDFCommand directive or the saveAsPDF method.
With regard to its PDF export, the Grid enables you to:
- Export all its pages to PDF
- Fit its content within the paper size
- Customize the exported columns
- Specify a page template
- Export multiple Grids to a single PDF file
- Trigger the export externally
- Export groups of rows to separate pages
- Save the generated PDF files
- Embed custom fonts
By default, the Grid exports only the current page of data. To export all pages, set the allPages option to
pageChange event fires with
skip set to 0 and
take to the total number of records. The original
take are restored after the export completes.
- The export of all Grid pages requires all records to be rendered at once. Behind the scenes, a Grid with no paging applied is rendered off-screen.
- The exact maximum number of exportable rows varies depending on the browser, system resources, template complexity, and other factors.
- Verify your own worst-case scenarios in each browser you intend to support.
- When the Grid templates contain asynchronously rendered content such as Kendo UI for Angular Charts, use the delay option to specify
the number of milliseconds by which the export will be postponed to ensure all content is rendered before the export starts.
By default, the paper size of the exported document is determined by the size of the Grid on the screen. However, you can define a specific paper size that will apply to the whole document. As a result, the content is scaled to fit the specified paper size. It is possible to override the automatic scale factor—for example, to make room for additional page elements.
To use the whole space that is available, the Grid:
- Adjusts the column widths to fill the page.
- Adapts the number of rows for each page and places page breaks where appropriate.
- Omits the toolbar and pager.
The Grid enables you to specify the columns that will be exported. To configure them, include the
<kendo-grid-column-group> components inside the
The Grid enables you to specify a page template that helps you position the content and add headers, footers, and other elements. To style the exported document, use CSS. During the PDF export, the template is positioned in a container with the specified paper size.
To define a page template, nest a
<ng-template> tag with the
kendoGridPDFTemplate directive inside the
The available page template variables are:
When you use a page template, you are required to set the paperSize option.
By default, the each Grid is exported to a separate document.
To export multiple Grids to the same document:
- Use the drawPDF method to get the group of Grids for export.
- Set the exportPDF method to export the group.
The Grid enables you to trigger the export operation by calling the saveAsPDF method.
You can manually split the exported data into separate pages by using the forcePageBreak option of the
- Sort the data by the respective field.
- By utilizing the rowClass function, add the class that will be used by the
forceBreakPageoption to the first row of each items group.
The following example demonstrates how to render all items with the same Category name to a separate PDF page.
Your project might require you to send the generated PDF file to a remote service. To achieve this behavior, set the
proxyUrl and forceProxy to
true. If the proxy returns
204 No Content, the Save As... dialog will not appear on the client.
The default fonts in the PDF files do not provide Unicode support. To render international characters, you need to embed an external font. For more information, refer to the article on custom fonts and PDF export.
The rendition of right-to-left content is not supported.
Exporting Master-Detail Grids to PDF is not supported.
Overflowing text is clipped and
text-overflow: ellipsisis not supported.
Images that are hosted on different domains might not be rendered unless the server provides the permissive Cross-Origin HTTP headers. Similarly, it might not be possible for fonts to load across domains.
Even if the proper CORS headers are provided, Internet Explorer 9 will not be able to load images or fonts from another domain, which might raise an uncatchable security exception. To support Internet Explorer 9, host the images and fonts on the same domain as the application.
The 1.5 PDF specification limits the maximum PDF document size to 5,080 x 5,080 millimeters (which equals to 200x200 inches). Larger files might not open in all viewers.
Older browsers, such as Internet Explorer 9 and Safari, require you to implement a server proxy. For more information, refer to the proxyUrl configuration section.