Export to PDF

The article refers to exporting of dhtmlxScheduler 4.1+. If you use dhtmlxScheduler 4.0 or earlier versions, see details here.

Starting from version 4.1, dhtmlxScheduler provides a new approach for exporting the scheduler into the PDF format - an online export service.

The service is free, but the output PDF file will contain the library's watermark under the GPL license. In case you buy a license, the result of export will be available without a watermark during the valid support period (12 months for all PRO licenses).

Using Export Services

There are several export services available. You can install them on your computer and export Scheduler to PDF locally.

Note that export services are not included into the Scheduler package, read the corresponding article to learn the terms of using each of them.

Limits on request size

There is a common API endpoint https://export.dhtmlx.com/scheduler which serves for export methods (exportToPDF, exportToPNG, etc.). Max request size is 10 MB.

Default Export to PDF

To export scheduler as a PDF document, do the following steps:

Include the https://export.dhtmlx.com/scheduler/api.js file on the page to enable the online export service:

<script src="codebase/dhtmlxscheduler.js"></script>
<script src="https://export.dhtmlx.com/scheduler/api.js"></script>  <link rel="stylesheet" href="codebase/dhtmlxscheduler.css" type="text/css">

Call the exportToPDF method to export the scheduler:

<input value="Export to PDF" type="button" onclick='scheduler.exportToPDF()'> 
<script>    scheduler.init('scheduler_here',new Date(2019,5,30),"month");
    scheduler.load("data/events");
</script>

Related sample: Export to PDF/PNG

Parameters of the export method

The exportToPDF() method takes as a parameter an object with a number of properties (all of the properties are optional):

name	(string) the name of the output file
format	('A0', 'A1', 'A2', 'A3', 'A4', 'A5') the format of the output PDF image
orientation	('portrait', 'landscape') sets the orientation of the output PDF image
zoom	(number) sets the zoom coefficient of the output PDF image
header	(string) specifies the header that will be added to the output PDF image. Note, you can use any HTML here
footer	(string) specifies the footer that will be added to the output PDF image. Note, you can use any HTML here
server	(string) sets the API endpoint for the request. Can be used with the local install of the export service. The default value is https://export.dhtmlx.com/scheduler
additional_settings	(object) an object with additional settings. The object can contain the following attributes: format - (string) the format of the output file: 'A3', 'A4', 'A5', 'Legal', 'Letter', 'Tabloid' landscape - (boolean) the portrait or landscape orientation of the output file. The attribute works only when the "format" attribute is specified. width - (string\|number\|"content") the width of the output page. The attribute is used when exporting multiple pages. height - (string\|number\|"content") the height of the output page. The attribute is used when exporting multiple pages.

Calling the export method with optional properties

scheduler.exportToPDF({
    name:"myscheduler.pdf",
    format:"A4",
    orientation:"portrait",
    zoom:1,
    header:"<h1>My company</h1>",
    footer:"<h4>Bottom line</h4>",
    server:"https://myapp.com/myexport/scheduler"
});

Name of the output file

To set a custom name for the output file, use the name property in the in the parameter of the exportToPDF method:

scheduler.exportToPDF({
    name:"my_beautiful_scheduler.pdf"});

Header/footer of the output file

To add a header/footer to the output PDF file, use the header/footer properties in the parameter of the exportToPDF method:

Note, you can use any HTML while specifying the parameters. While specifying images, remember that you need to set global paths as values of the "src" attribute.

scheduler.exportToPDF({
    name:"myscheduler.pdf",
    header:"<h1>My company</h1>",    footer:"<h4>Bottom line</h4>"});

Custom style for the output file

To apply a custom style for the scheduler, provide the stylesheet with your custom CSS classes:

through a link:

scheduler.exportToPDF({
    name:"calendar.pdf",
    header:'<link rel="stylesheet" href="http://mysite.com/custom.css">' });

or through the 'style' tag:

scheduler.exportToPDF({
    name:"calendar.pdf",
    header:'<style>... custom css classes here ...</style>' });

Note, the aforementioned solution works for the global HTTP reference. If you have CSS classes specified in an Intranet/local environment, you can embed all styles as in:

scheduler.exportToPDF({
    header:"<style>.tier1{background: red; color:white;}</style>"
});