2016-05-26 6 views
0

Ich versuche, JSP-Code in PDF-Datei mit JsPDF zu konvertieren. Aber es gibt mir die TypeError: pdf.fromHTML ist keine Funktion. Ich habe die jspdf zip von https://github.com/MrRio/jsPDF heruntergeladen. Mein Code ist:TypeError: pdf.fromHTML ist keine Funktion beim Konvertieren von HTML in PDF mit jspdf

<html> 
<head> 

<title>Exporting table data to pdf Example</title> 


<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.3.js"></script> 
<script src="jsPDF/jspdf.js"></script> 
<script src="jsPDF/main.js"></script> 



<script type="text/javascript"> 
    $(document).ready(function() { 

     $("#exportpdf").click(function() { 
      var pdf = new jsPDF('p', 'pt', 'ledger'); 
      // source can be HTML-formatted string, or a reference 
      // to an actual DOM element from which the text will be scraped. 
      source = $('#yourTableIdName')[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 : 60, 
       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('fileNameOfGeneretedPdf.pdf'); 
      }, margins); 
     }); 

    }); 
</script> 



</head> 
<body> 
<div id="yourTableIdName"> 
    <table style="width: 1020px;font-size: 12px;" border="1"> 
     <thead> 
      <tr align="left"> 
       <th>Country</th> 
       <th>State</th> 
       <th>City</th> 
      </tr> 
     </thead> 


     <tbody> 

      <tr align="left"> 
       <td>India</td> 
       <td>Telangana</td> 
       <td>Nirmal</td> 
      </tr> 
<tr align="left"> 
       <td>India</td> 
       <td>Telangana</td> 
       <td>Nirmal</td> 
      </tr><tr align="left"> 
       <td>India</td> 
       <td>Telangana</td> 
       <td>Nirmal</td> 
      </tr><tr align="left"> 
       <td>India</td> 
       <td>Telangana</td> 
       <td>Nirmal</td> 
      </tr><tr align="left"> 
       <td>India</td> 
       <td>Telangana</td> 
       <td>Nirmal</td> 
      </tr><tr align="left"> 
       <td>India</td> 
       <td>Telangana</td> 
       <td>Nirmal</td> 
      </tr><tr align="left"> 
       <td>India</td> 
       <td>Telangana</td> 
       <td>Nirmal</td> 
      </tr> 
     </tbody> 
    </table></div> 

    <input type="button" id="exportpdf" value="Download PDF"> 


</body> 

</html> 

Antwort

0

Sie in die falsche Datei zu laden.

Mit Javascript-Bibliotheken gibt es die rohen Quelldateien, und dann gibt es die kompilierten Dateien für die Verteilung bereit. Wenn Sie also eine solche Bibliothek betrachten und die Datei finden möchten, die sie enthalten soll, ist es üblich, das Verzeichnis dist/ einzusehen. Sie müssen also entweder jspdf.debug.js oder jspdf.min.js

Die Beispiele im Repository enthalten sind eine gute Möglichkeit zu wissen, wie Sie die Bibliothek einbeziehen und verwenden. Schauen Sie sich den Grund Beispiel hier ansehen:

https://github.com/MrRio/jsPDF/blob/master/examples/basic.html

0

einfach die folgenden Abhängigkeiten verwenden.

<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.3.js"></script> 

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.debug.js"></script> 

Vergewissern Sie sich, beziehen Sie keine andere jspdf.js Datei, die die jspdf.debug.js Datei überschreiben. Das Einschließen mehrerer Versionen führt ebenfalls zu Problemen.