Wijmo UI for the Web
Export To PDF
Wijmo User Guide > Widgets > EventsCalendar > Export To PDF

In this topic, you'll learn how to add references for Wijeventscalendar export to an HTML project using HTML markup and jQuery script, and to customize a number of PDF settings for the export.

Use the script and markup below to export your Wijeventscalendar to PDF file format, and set various options, such as document image quality, compression speed, fontType etc. You can also password protect your document and restrict content copying and editing. For more information on PDF exporting, refer to Export PDF Settings.

The script below initializes the widget and provides various options to export events calendar on button click:
Script
Copy Code
    <script id="scriptInit" type="text/javascript">
        require(["wijmo.wijevcal", "amplify", "wijmo.wijaccordion", "wijmo.wijtextbox", "wijmo.wijcheckbox", "wijmo.wijdropdown", "eventscalendarexport"], function () {
            $(document).ready(function () {
                $("#eventscalendar").wijevcal();
                $("#accordion").wijaccordion({
                    header: "h3"
                });
                $(".settingcontainer input[type='text'],.settingcontainer input[type='password']").wijtextbox();
                $(".settingcontainer select").wijdropdown();
                $(".settingcontainer input[type='checkbox']").wijcheckbox();
                $("#exportImage").button().click(function () {
                    var type = $("#exporttype").val();
                    $("#eventscalendar").wijevcal("exportEventsCalendar", {
                        serviceUrl: getServiceUrl(),
                        eventsCalendar: $("#eventscalendar").data("wijmo-wijevcal"),
                        exportFileType: wijmo.exporter.ExportFileType[type],
                        fileName: $("#fileName").val(),
                        receiver: saveFile,
                        contentType: $("#requestContentType").val(),
                        method: wijmo.exporter.ExportMethod[$("#exportMode").val()]
                    });
                });
                $("#exportPdf").button().click(function () {
                    $("#eventscalendar").wijevcal("exportEventsCalendar", {
                        fileName: $("#fileName").val(),
                        serviceUrl: getServiceUrl(),
                        eventsCalendar: $("#eventscalendar").data("wijmo-wijevcal"),
                        exportFileType: wijmo.exporter.ExportFileType.Pdf,
                        receiver: saveFile,
                        contentType: $("#requestContentType").val(),
                        method: wijmo.exporter.ExportMethod[$("#exportMode").val()],
                        pdf: {
                            imageQuality: wijmo.exporter.ImageQuality[$("#imageQuality option:selected").val()],
                            compression: wijmo.exporter.CompressionType[$("#compression option:selected").val()],
                            fontType: wijmo.exporter.FontType[$("#fontType option:selected").val()],
                            author: $("#pdfAuthor").val(),
                            creator: $("#pdfCreator").val(),
                            subject: $("#pdfSubject").val(),
                            title: $("#pdfTitle").val(),
                            producer: $("#pdfProducer").val(),
                            keywords: $("#pdfKeywords").val(),
                            encryption: wijmo.exporter.PdfEncryptionType[$("#encryption option:selected").val()],
                            ownerPassword: $("#ownerPassword").val(),
                            userPassword: $("#userPassword").val(),
                            allowCopyContent: $("#allowCopyContent").prop('checked'),
                            allowEditAnnotations: $("#allowEditAnnotations").prop('checked'),
                            allowEditContent: $("#allowEditContent").prop('checked'),
                            allowPrint: $("#allowPrint").prop('checked')
                        }
                    });
                });
            });
        });
    </script>
    <style type="text/css">
    #eventscalendar
     {
       width: 700px;
       height:550px;
     }
</style>
Script
Copy Code
<div id="eventscalendar"></div>
<input type="button" value="Export to PDF" id="exportPDF"/>
See Also

Concepts