here's an example using html2canvas & jspdf, although how you generate the canvas doesn't matter--we're just going to use the height of that as the breakpoint on a for loop, in which a new page is created and content added to it.

after the for loop, the pdf is saved.

function makePDF() {

   var quotes = document.getElementById('container-fluid');
   html2canvas(quotes).then((canvas) => {
        //! MAKE YOUR PDF
        var pdf = new jsPDF('p', 'pt', 'letter');

        for (var i = 0; i <= quotes.clientHeight/980; i++) {
            //! This is all just html2canvas stuff
            var srcImg  = canvas;
            var sX      = 0;
            var sY      = 980*i; // start 980 pixels down for every new page
            var sWidth  = 900;
            var sHeight = 980;
            var dX      = 0;
            var dY      = 0;
            var dWidth  = 900;
            var dHeight = 980;

            window.onePageCanvas = document.createElement("canvas");
            onePageCanvas.setAttribute('width', 900);
            onePageCanvas.setAttribute('height', 980);
            var ctx = onePageCanvas.getContext('2d');
            // details on this usage of this function: 
            // https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Using_images#Slicing
            ctx.drawImage(srcImg,sX,sY,sWidth,sHeight,dX,dY,dWidth,dHeight);

            // document.body.appendChild(canvas);
            var canvasDataURL = onePageCanvas.toDataURL("image/png", 1.0);

            var width         = onePageCanvas.width;
            var height        = onePageCanvas.clientHeight;

            //! If we're on anything other than the first page,
            // add another page
            if (i > 0) {
                pdf.addPage(612, 791); //8.5" x 11" in pts (in*72)
            }
            //! now we declare that we're working on that page
            pdf.setPage(i+1);
            //! now we add content to that page!
            pdf.addImage(canvasDataURL, 'PNG', 20, 40, (width*.62), (height*.62));

        }
        //! after the for loop is finished running, we save the pdf.
        pdf.save('Test.pdf');
  });
}

If above answer does not work i have done it like this :

download and include in order :

1. Jquery
2. html2canvas
3. jspdf

google them they are easy to find. then have your printable code in a div wrapper report. and call the function with print button. for example (In jsfiddle code will not work because it does not allow external code from non cdn sites but it will work on server)

$(document).ready(function() {
   var form = $('#report');
   var cache_width = form.width();
   var a4 = [595.28, 841.89];


   $('#create_pdf').on('click', function() {
     $('body').scrollTop(0);
     createPDF();
   });

   //create pdf
   function createPDF() {
     getCanvas().then(function(canvas) {
       var imgWidth = 200;
       var pageHeight = 290;
       var imgHeight = canvas.height * imgWidth / canvas.width;
       var heightLeft = imgHeight;
       var doc = new jsPDF('p', 'mm');
       var position = 0;

       var img = canvas.toDataURL("image/jpeg");




 doc.addImage(img, 'JPEG', 0, position, imgWidth, imgHeight);
   heightLeft -= pageHeight;



   while (heightLeft >= 0) {
     position = heightLeft - imgHeight;
     doc.addPage();
     doc.addImage(img, 'JPEG', 0, position, imgWidth, imgHeight);
     heightLeft -= pageHeight;
   }


   doc.save('Report.pdf');
   form.width(cache_width);
  });
 }


 // create canvas object
   function getCanvas() {
     form.width((a4[0] * 1.33333) - 80).css('max-width', 'none');
     return html2canvas(form, {
       imageTimeout: 2000,
       removeContainer: false
     });
   }

});

https://jsfiddle.net/vnfts73o/1

We can create PDF of multiple pages, but create partitions of pages in HTML separated by class

Then we can combine both jsPDF and html2canvas as follow

    var pdf = new jsPDF('p', 'pt', [580, 630]);

    html2canvas($(".page1")[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));

        }
    });
    html2canvas($(".page2")[0], {
        allowTaint: true,
        onrendered: function(canvas) {
            var ctx = canvas.getContext('2d');
            var imgData = canvas.toDataURL("image/png", 1.0);
            var htmlH = $(".page2").height() + 100;
            var width = canvas.width;
            var height = canvas.clientHeight;
            pdf.addPage(580, htmlH);
            pdf.addImage(imgData, 'PNG', 20, 20, (width - 40), (height));
        }
    });
    html2canvas($(".page3")[0], {
        allowTaint: true,
        onrendered: function(canvas) {
            var ctx = canvas.getContext('2d');
            var imgData = canvas.toDataURL("image/png", 1.0);
            var htmlH = $(".page2").height() + 100;
            var width = canvas.width;
            var height = canvas.clientHeight;
            pdf.addPage(580, htmlH);
            pdf.addImage(imgData, 'PNG', 20, 20, (width - 40), (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/