PDFMake.JS Tutorial to Add Page Numbers With Border at Footer Inside PDF Document in Browser Using Javascript

You are currently viewing PDFMake.JS Tutorial to Add Page Numbers With Border at Footer Inside PDF Document in Browser Using Javascript

PDFMake.js Tutorial to Add Page Numbers With Border at Footer inside PDF Document in Browser Using Javascript

<!doctype html>
<html lang='en'>
<head>
  <meta charset='utf-8'>
  <title>my example</title>
  <!-- pdfmake files: -->
  <script src='https://cdn.jsdelivr.net/npm/pdfmake@latest/build/pdfmake.min.js'></script>
  <script src='https://cdn.jsdelivr.net/npm/pdfmake@latest/build/vfs_fonts.min.js'></script>
  <!-- html-to-pdfmake file: -->
  <script src="https://cdn.jsdelivr.net/npm/html-to-pdfmake/browser.js"></script>
   <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
</head>
<body>
 
  </body>
  <script>
 
 
         var dd = {
    pageMargins: [ 40, 40, 40, 100 ],
    footer: function (currentPage, pageCount) {
        return {
            table: {
                body: [
                    [
                        { text: "Page " + currentPage.toString() + ' of ' + pageCount, alignment: 'right', style: 'normalText', margin: [0, 20, 50, 0] }
                    ],
                ]
            },
            layout: 'Borders'
        };
    },
    content: [
        {text: 'Text bcbcvb', pageBreak:'after'},
        {text: 'Text fgdfg', pageBreak:'after'},
        {text: 'Text fgdfgdfg', pageBreak:'after'},
    ]
}
    pdfMake.createPdf(dd).download();
 
  
    
    // playground requires you to assign document definition to a variable called dd
 
  </script>
</body>
</html>

Ranjith

Hi, I'm Manoj a full-time Blogger, YouTuber, Affiliate Marketer, & founder of Coding Diksha. Here, I post about programming to help developers.

Leave a Reply