New to Kendo UI for jQuery? Download free 30-day trial

Create an Inline PDF from the Spreadsheet and Embed It in an iFrame


Product Progress® Kendo UI® Spreadsheet for jQuery


How can I generate a PDF from a Kendo UI Spreadsheet and display the PDF in a separate <iframe>?


Load the generated base64 PDF data in the <iframe> element. To do that, use the draw() method of the Spreadsheet Sheet object. To properly load the data in the <iframe>, opne the following example in the full screen mode of the Dojo.

<input type="button" id="btn" value="PDF export Spreadsheet" />
<div id="spreadsheet" style="width: 100%;"></div>
<div id="pdf_preview" style="height:400px; width:400px"></div>

  $(function() {
    $('#btn').on('click', function () {
      var spread = $('#spreadsheet').getKendoSpreadsheet();
      var activeSheet = spread.activeSheet();
      $('#pdf_preview').html(`<iframe id="embedded-pdf" name="invoice.pdf" type="application/pdf" width="100%" height="100%"></iframe>`);
      activeSheet.draw(function (group) {
          .done(function (data) {
          $('#embedded-pdf').attr('src', data);

      excel: {
        proxyURL: ""
      pdf: {
        proxyURL: ""
      sheets: [{
        name: "Food Order"

See Also

In this article