can you guys show me how to change column font size and weight from the doc object in the customize(doc) function of the DataTables html5 PDF Export, using a css class.
I have a datatable where some columns must be bold and bigger than the others.
I have the following buttons definition (, which doesn't seem to work
$('.data-table').DataTable({
buttons: [
{
extend: 'pdfHtml5',
text: '<i class="fa fa-file-pdf-o fa-lg" style="color: red"></i> PDF',
titleAttr: 'Export to PDF',
orientation: 'auto',
className: 'btn btn-default',
customize: function (doc) {
doc.defaultStyle.fontSize = 8;
doc.content[1].table.widths = ['*', 70, 70];
doc.styles['td.bigcol'] = {
fontSize: 16,
bold: true,
};
doc.content.splice(1, 0, {
margin: [0, 0, 0, 12],
image: 'data:image/png;base64,' + imageStr,
fit: [80, 80]
});
}
}
]
});
my table is similar to this:
<table class="table data-table">
<thead>
<tr>
<td class="bigCol">
Some List of things
</td>
<td></td>
<td></td>
</tr>
</thead>
<tbody>
<tr>
<td class="bigCol">On List 1</td>
<td></td>
<td></td>
</tr>
<tr>
<td>data</td>
<td>data</td>
<td>data</td>
</tr>
<tr>
<td>data</td>
<td>data</td>
<td>data</td>
</tr>
<tr>
<td>data</td>
<td>data</td>
<td>data</td>
</tr>
<tr>
<td class="bigCol">list 1 totals</td>
<td>data</td>
<td>data</td>
</tr>
</tbody>
</table>
this goes on to like list 9. The table shows correctly on the browser window, but the pdf ayayayyy
Thanks.