CODEWITHSUNDEEP
javascripthtmljspdfjspdf-autotable
Beckham_Vinoth
Beckham_Vinoth

Reputation: 721

Getting error while using jsPdf Autotable

Am trying to print the Data into the PDF so i used jsPdf , at that time the data's are not aligned properly into my PDF table . So i searched in many site's they referred me to use jsPdf Auto-table . Here the problem arises , before the injection of jsPdf Auto-table every thing is working fine(without alignment) but after i insert 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf-autotable/2.0.16/jspdf.plugin.autotable.js"></script>

this into my index.html am getting error,

Uncaught ReferenceError: jsPDF is not defined (jspdf.plugin.autotable.js:10)

Upvotes: 0

Views: 15402

Answers (2)

Simon Bengtsson
Simon Bengtsson

Reputation: 8151

You need to include the jspdf library before the jspdf-autotable plugin. See the docs for further information. You might also want to the latest version.

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

<!-- EDIT: For now, add this line between the libraries -->
<!-- The reason being that jspdf includes a version of requirejs which -->
<!-- jspdf-autotable currently is not expecting. You can also use version < 2.0.21 -->
<script>if (window.define) delete window.define.amd;</script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf-autotable/2.0.28/jspdf.plugin.autotable.js"></script>

<script>
var columns = ["ID", "Name", "Country"];
var rows = [
   [1, "Shaw", "Tanzania"],
   [2, "Nelson", "Kazakhstan"],
   [3, "Garcia", "Madagascar"]
];
var doc = new jsPDF('p', 'pt');
doc.autoTable(columns, rows);
doc.save('table.pdf');
</script>

Upvotes: 3

Dheeraj
Dheeraj

Reputation: 326

This is not directly related but for people who are trying to use this on Angular 4 project created by angular cli and got the doc.autoTable is not a function. include jspdf and jspdf.plugin.autotable in .angular-cli.json file in scripts array

"scripts": [
    "../node_modules/jspdf/dist/jspdf.min.js",
     "../node_modules/jspdf-autotable/dist/jspdf.plugin.autotable.src.js"
  ],

then in the component you want to use auto table first import jspdf and jspdf-autotable 

import * as jsPDF from 'jspdf';
import * as jpt from 'jspdf-autotable';

Then use as below. You have to declare jpt variable before making the doc.autotable call 

let doc = new jsPDF('p', 'pt');    jpt; 
doc.autoTable(this.columns, this.data);
doc.text(20, 20, 'Hello world!');
doc.text(20, 40, 'This is client-side Javascript, pumping out a PDF.');

// Save the PDF
doc.save('Test.pdf');

Upvotes: 2

Related Questions