CODEWITHSUNDEEP
javascriptangularjshtml
Charul
Charul

Reputation: 252

JsPDF repeating first row on every new page

I am saving a PDF using jspdf.I have tables in my HTML and that tables do not have headers.But feature of JsPDF is automatically repeating the first row of my table on every page and they are overlapping.I do not want headers on every new page.Is there any way to do so.Attaching a screenshot of page.Thanks in advance!!! 

$scope.SavePage = function() {
    var doc = new jsPDF('p', 'pt', 'a4', true);
    margins = {
        top: 200,
        bottom: 60,
        left: 40,
        width: 522
    };
    specialElementHandlers = {
        '#ignoreComponent': function(element, renderer) {
            return true
        },
        '#ignorePage': function(element, renderer) {
            return true
        }
    };

var source = $('#pageInformationPdf')[0];

doc.fromHTML(source, margins.left, margins.top, {
        'width': margins.width,
        'pagesplit': true,
        'elementHandlers': specialElementHandlers
    },
    function(dispose) {
        doc.save(pageName + '.pdf');
        }, margins);

}

Upvotes: 3

Views: 3413

Answers (2)

Mailis
Mailis

Reputation: 21

With newer version (3.x.x) you can use willDrawCell hook. For example just to hide headers (additional logic can be applied):

willDrawCell (HookData) {
  if (HookData.section === 'head') {
    return false
  }
},

Upvotes: 2

Sunil
Sunil

Reputation: 11243

You can use the drawHeaderRow hook. Below is sample code

function generate() {
  var doc = new jsPDF('p', 'pt');
  var elem = document.getElementById('table');
  var data = doc.autoTableHtmlToJson(elem);

  //Do not print the header if current page not the first page.
  doc.autoTable(data.columns, data.rows, {
    drawHeaderRow: function(row, data) {
      if (data.pageCount > 1) {
        return false;
      }
    }
  });

  doc.save("table.pdf");
}

html

<button onclick="generate()">Generate PDF</button>

<table id="table" style="display: none;">
    <thead>
    <tr>
        <th>ID</th>
        <th>First name</th>
        <th>Last name</th>
        <th>Email</th>
        <th>Country</th>
        <th>IP-address</th>
    </tr>
    </thead>
    <tbody>
    <tr>
        <td align="right">1</td>
        <td>Donna</td>
        <td>Moore</td>
        <td>[email protected]</td>
        <td>China</td>
        <td>211.56.242.221</td>
    </tr>
    <tr>
        <td align="right">2</td>
        <td>Janice</td>
        <td>Henry</td>
        <td>[email protected]</td>
        <td>Ukraine</td>
        <td>38.36.7.199</td>
    </tr>
    </tbody>
</table>

Upvotes: 1

Related Questions