Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Learn more about Collectives

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

Learn more about Teams

So this is my HTML code where I'm trying to get whatever is outputted in the div abc to a downloadable pdf file.

<!-- Page Heading -->
<div class="row">
    <div class="col-lg-12">
        <h1 class="page-header">
            Reports
        <ol class="breadcrumb">
                <i class="fa fa-dashboard"></i>  <a href="dashboard">Dashboard</a>
            <li class="active">
                <i class="fa fa-edit"></i> Reports
          <div id="abc">
<div id="editor"></div>
<button id="cmd">Download Survey Report</button>
        <div id="abc">
        </body>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.3/jspdf.min.js"></script>
        <script>
                var doc = new jsPDF();
                var specialElementHandlers = {
                  '#editor': function (element, renderer) {
                return true;
        $('#cmd').click(function () {
            doc.fromHTML($('#abc').html(), 15, 15, {
                'width': 170,
                    'elementHandlers': specialElementHandlers
            doc.save('SurveyReport.pdf');
        </script>
        <script>
        firebase.auth().onAuthStateChanged(function(user){
          if(user){
            var userID = user.uid;
            RetrieveSurvey(userID,1,PrintSurvey(document.getElementById("abc")));
        </script>

And I'm getting this error on the console:

"Uncaught ReferenceError: jsPDF is not defined"

I am not sure what I'm doing wrong here, I even added jsPDF in the script tag...

Why do you have <body></body> tags inside a <div>? Also ids are supposed to be unique, you cannot have 2 id="abc" tags. – gen_Eric Apr 10, 2017 at 21:47 Working fine. However, just to be clear for anyone using this for the first time...I used this code at the top of my script file. Not sure if it works within script tags inside the html file. – Andres Alvarez Feb 7, 2022 at 16:58 Can someone explain what this line does. I presume that window.jsPDF becomes a new property of the window obj, but what is window.jspdf.jsPDF? Does window.jspdf represent the jsPDF scriptfile, and is the .jsPDF an obj within that file? – Nikkorian Jul 24, 2022 at 7:09

First of all your HTML is invalid. Check W3S.

Put your link to jspdf inside <head> tag, you can do it even inside <body> tag.

Replace your jspdf script with latest one:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.4/jspdf.min.js"></script>
                Welcome to SO! Thanks for contributing. However, I would edit your answer to add additional explanation. For more help, see how to answer.
– technogeek1995
                Aug 26, 2019 at 16:06
        

Thanks for contributing an answer to Stack Overflow!

  • Please be sure to answer the question. Provide details and share your research!

But avoid

  • Asking for help, clarification, or responding to other answers.
  • Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.