Won't Fix
Last Updated: 18 May 2021 15:43 by ADMIN
Created by: Aidan
Comments: 2
Category: Kendo UI for Angular
Type: Bug Report
1

Hello,

 

The PDF export component does not seem to handle tables that are in the editor content. In the Stackblitz example I included, which is based off of the PDF export demo under the Editor component, the table borders do not show in the editor and in the exported PDF. In my own practice, any editor version 8 and above will not export the tables to PDF. In fact, the exported PDF is blank no matter what is in the editor. Here is what I am using. When I change the editor version to 0.7.0, the PDF export works (albeit without table support). I would like to be able to export the tables that inside of the editor's content to PDF. This problem only started happening after I updated my editor to versions 0.8.0 and above.  


<kendo-pdf-export #pdf paperSize="Letter" margin="1cm" [scale]="scale">
                    <kendo-editor #editor iframe="false" style="align-self: auto; padding: 20px; height: 90vh; width: 24cm; margin: 0 auto;" [(value)]="value" 
                    (dragover)="onDragOver(event)" (drop)="onDrop(event)">
                      <kendo-toolbar>
                        <kendo-toolbar-buttongroup>
                          <kendo-toolbar-button kendoEditorUndoButton></kendo-toolbar-button>
                          <kendo-toolbar-button kendoEditorRedoButton></kendo-toolbar-button>
                        </kendo-toolbar-buttongroup>
                        <kendo-toolbar-buttongroup>
                          <kendo-toolbar-button kendoEditorBoldButton></kendo-toolbar-button>
                          <kendo-toolbar-button kendoEditorItalicButton></kendo-toolbar-button>
                          <kendo-toolbar-button kendoEditorUnderlineButton></kendo-toolbar-button>
                          <kendo-toolbar-button kendoEditorStrikethroughButton></kendo-toolbar-button>
                        </kendo-toolbar-buttongroup>
                        <kendo-toolbar-buttongroup>
                          <kendo-toolbar-button kendoEditorSubscriptButton></kendo-toolbar-button>
                          <kendo-toolbar-button kendoEditorSuperscriptButton></kendo-toolbar-button>
                        </kendo-toolbar-buttongroup>
                        <kendo-toolbar-buttongroup>
                          <kendo-toolbar-button kendoEditorAlignLeftButton></kendo-toolbar-button>
                          <kendo-toolbar-button kendoEditorAlignCenterButton></kendo-toolbar-button>
                          <kendo-toolbar-button kendoEditorAlignRightButton></kendo-toolbar-button>
                          <kendo-toolbar-button kendoEditorAlignJustifyButton></kendo-toolbar-button>
                        </kendo-toolbar-buttongroup>
                        <kendo-toolbar-dropdownlist kendoEditorFormat></kendo-toolbar-dropdownlist>
                        <kendo-toolbar-dropdownlist kendoEditorFontSize></kendo-toolbar-dropdownlist>
                        <kendo-toolbar-dropdownlist kendoEditorFontFamily></kendo-toolbar-dropdownlist>
                        <kendo-toolbar-colorpicker kendoEditorForeColor></kendo-toolbar-colorpicker>
                        <kendo-toolbar-colorpicker kendoEditorBackColor></kendo-toolbar-colorpicker>
                        <kendo-toolbar-buttongroup>
                          <kendo-toolbar-button kendoEditorInsertUnorderedListButton></kendo-toolbar-button>
                          <kendo-toolbar-button kendoEditorInsertOrderedListButton></kendo-toolbar-button>
                          <kendo-toolbar-button kendoEditorIndentButton></kendo-toolbar-button>
                          <kendo-toolbar-button kendoEditorOutdentButton></kendo-toolbar-button>
                        </kendo-toolbar-buttongroup>
                        <kendo-toolbar-buttongroup>
                          <kendo-toolbar-button kendoEditorCreateLinkButton></kendo-toolbar-button>
                          <kendo-toolbar-button kendoEditorUnlinkButton></kendo-toolbar-button>
                        </kendo-toolbar-buttongroup>

                        <kendo-editor-insert-table-button></kendo-editor-insert-table-button>
                        <kendo-toolbar-buttongroup>
                          <kendo-toolbar-button kendoEditorAddColumnBeforeButton></kendo-toolbar-button>
                          <kendo-toolbar-button kendoEditorAddColumnAfterButton></kendo-toolbar-button>
                          <kendo-toolbar-button kendoEditorAddRowBeforeButton></kendo-toolbar-button>
                          <kendo-toolbar-button kendoEditorAddRowAfterButton></kendo-toolbar-button>
                        </kendo-toolbar-buttongroup>
                        <kendo-toolbar-buttongroup>
                          <kendo-toolbar-button kendoEditorDeleteColumnButton></kendo-toolbar-button>
                          <kendo-toolbar-button kendoEditorDeleteRowButton></kendo-toolbar-button>
                          <kendo-toolbar-button kendoEditorDeleteTableButton></kendo-toolbar-button>
                        </kendo-toolbar-buttongroup>
                        <kendo-toolbar-button kendoEditorInsertFileButton></kendo-toolbar-button>
                        <kendo-toolbar-button kendoEditorInsertImageButton></kendo-toolbar-button>
                        <kendo-toolbar-button kendoEditorViewSourceButton></kendo-toolbar-button>


                        <kendo-toolbar-button text="Export as PDF"
                                              [icon]="'pdf'"
                                              (click)="pdf.saveAs('editor-content.pdf')"></kendo-toolbar-button>
                      </kendo-toolbar>
                    </kendo-editor>
                  </kendo-pdf-export>