Colored odd /even rows in a table

[ilhamkaddourii]

Hello,

What would be the best way to use colored background on a table, depending if the row is odd or even or based on certain number aka each 3 or so? there is nth child property in css but i can't get it to work

thank you!

[Aymkdn]

By using:

1. The 'layout' attribute on your table (https://github.com/Aymkdn/html-to-pdfmake#special-properties)
2. Then by defining a PDFMake layout function (https://pdfmake.github.io/docs/0.1/document-definition-object/tables/)

So the HTML Code:

<table data-pdfmake="{'layout':'zebra'}">
  <tr><th>Header 1</th><th>Header 2</th></tr>
  <tr><td>Row 1</td><td>Row 1</td></tr>
  <tr><td>Row 2</td><td>Row 2</td></tr>
  <tr><td>Row 3</td><td>Row 3</td></tr>
  <tr><td>Row 4</td><td>Row 4</td></tr>
</table>  

And the JS code should look like:

// generate the PDFMake code from HTML
var result = htmlToPdfMake("…html…");
// set the doc definition
var docDefinition = {
  content: [ result ]
}
// generate the PDF by passing an additional parameter
var pdfDocGenerator = pdfMake.createPdf(docDefinition, {
  zebra: {
    // I took the below code from the PDFMake Playground
    fillColor: function (rowIndex, node, columnIndex) {
       return (rowIndex % 2 === 0) ? '#CCCCCC' : null;
    }
  }
});

Disclaimer: I didn't test this code, but it should be pretty accurate.

[github-actions[bot]]

This issue has been automatically closed because the requestor didn't provide any additional comment.