Export HTML table to pdf using jspdf

Question

I need to export the HTML table to pdf file using jspdf  I tried the below code but it displays the blank empty output in pdf file  Any suggestions or sample code for this would be helpful      lt script type  text javascript  gt      function demo1               function                  var specialElementHandlers                       editor   function  element renderer                        return true                                                cmd   click function                      var doc   new jsPDF                    doc fromHTML     htmlTableId   html    15  15                         width   170  elementHandlers   specialElementHandlers                                     doc save  sample-file pdf                                          lt  script gt

User · Answer

You can also use the jsPDF-AutoTable plugin  You can check out a demo here that uses the following code   var doc   new jsPDF  p    pt    var elem   document getElementById  basic-table    var res   doc autoTableHtmlToJson elem   doc autoTable res columns  res data   doc save  table pdf

User · Answer

Use get 0  instead of html     In other words  replace  doc fromHTML     htmlTableId   html    15  15         width   170  elementHandlers   specialElementHandlers       with  doc fromHTML     htmlTableId   get 0   15  15         width   170  elementHandlers   specialElementHandlers

User · Answer

Here is working example   in head   lt script type  text javascript  src  jspdf debug js  gt  lt  script gt    script    lt script type  text javascript  gt          function demoFromHTML                 var pdf   new jsPDF  p    pt    letter                   source can be HTML-formatted string  or a reference                to an actual DOM element from which the text will be scraped              source       customers   0                   we support special element handlers  Register them with jQuery-style                 ID selector for either ID or node name     iAmID    div    span  etc                  There is no support for any other type of selectors                  class  of compound  at this time              specialElementHandlers                        element with id of  bypass  - jQuery style selector                   bypassme   function element  renderer                           true    handled elsewhere  bypass text extraction                      return true                                              margins                     top  80                  bottom  60                  left  40                  width  522                               all coords and widths are in jsPDF instance s declared units                 inches  in this case             pdf fromHTML                      source     HTML string or DOM elem ref                      margins left     x coord                     margins top      y coord                          width   margins width     max width of content on PDF                          elementHandlers   specialElementHandlers                                    function dispose                       dispose  object with X  Y of the last line add to the PDF                              this allow the insertion of new lines after html                 pdf save  Test pdf                                margins                  lt  script gt    and table    lt div id  customers  gt           lt table id  tab customers  class  table table-striped   gt               lt colgroup gt                   lt col width  20   gt                   lt col width  20   gt                   lt col width  20   gt                   lt col width  20   gt               lt  colgroup gt               lt thead gt                            lt tr class  warning  gt                       lt th gt Country lt  th gt                       lt th gt Population lt  th gt                       lt th gt Date lt  th gt                       lt th gt Age lt  th gt                   lt  tr gt               lt  thead gt               lt tbody gt                   lt tr gt                       lt td gt Chinna lt  td gt                       lt td gt 1 363 480 000 lt  td gt                       lt td gt March 24  2014 lt  td gt                       lt td gt 19 1 lt  td gt                   lt  tr gt                   lt tr gt                       lt td gt India lt  td gt                       lt td gt 1 241 900 000 lt  td gt                       lt td gt March 24  2014 lt  td gt                       lt td gt 17 4 lt  td gt                   lt  tr gt                   lt tr gt                       lt td gt United States lt  td gt                       lt td gt 317 746 000 lt  td gt                       lt td gt March 24  2014 lt  td gt                       lt td gt 4 44 lt  td gt                   lt  tr gt                   lt tr gt                       lt td gt Indonesia lt  td gt                       lt td gt 249 866 000 lt  td gt                       lt td gt July 1  2013 lt  td gt                       lt td gt 3 49 lt  td gt                   lt  tr gt                   lt tr gt                       lt td gt Brazil lt  td gt                       lt td gt 201 032 714 lt  td gt                       lt td gt July 1  2013 lt  td gt                       lt td gt 2 81 lt  td gt                   lt  tr gt               lt  tbody gt           lt  table gt        lt  div gt    and button to run    lt button onclick  javascript demoFromHTML    gt PDF lt  button gt    and working example online   tabel to pdf jspdf  or try this  HTML Table Export

User · Answer

We can separate out section of which we need to convert in PDF  For example  if table is in class  pdf-table-wrap   After this  we need to call html2canvas function combined with jsPDF  following is sample code  var pdf   new jsPDF  p    pt    580  630    html2canvas     pdf-table-wrap   0         onrendered  function canvas            document body appendChild canvas           var ctx   canvas getContext  2d            var imgData   canvas toDataURL  image png   1 0           var width   canvas width          var height   canvas clientHeight          pdf addImage imgData   PNG   20  20   width - 10    height               setTimeout function           jsPDF code to save file     pdf save  sample pdf       0     Complete tutorial is given here http   freakyjolly com create-multipage-html-pdf-jspdf-html2canvas

[jspdf] Export HTML table to pdf using jspdf

Examples related to jspdf