DataTables & PDFmake

Question

I am trying to work with the DataTables export function, where I can export CSV, xlxs, pdf. Now my current requirement is to export custom PDF (change font size, color, etc.). The DataTable documentation states that we can integrate it with PDFmake, which I cannot do.

If someone can help integrate / use PDFmake with DataTables, that would be very helpful.

Thanks in advance.

I initialize DataTables

> var table = $('#Table').DataTable( { > lengthChange: true, > buttons: [ > 'copyHtml5', > { > extend: 'csvHtml5', > title: 'FileName' > }, > { > extend: 'excelHtml5', > title: 'FileName' > }, > { > extend: 'pdfHtml5', > orientation: 'landscape', > title: 'FileName', > //download: 'open', > pageSize: 'A3' > } > ] > } ); 

I have all the necessary JS and CSS files, how can I link PDFMake with this?

Answer 1

You can access the PdfMake object when declaring DataTables and change the font as follows:

 window.pdfMake.fonts = { alef: { normal: 'Alef-Bold.ttf', bold: 'Alef-Bold.ttf', italics: 'Alef-Bold.ttf"', bolditalics: 'Alef-Bold.ttf', } }; 

This code designates the custom Alef font to be used. The font that I assigned as vfs.

(see https://github.com/bpampuch/pdfmake/wiki/Custom-Fonts---client-side if you are interested in how to do this)

For other settings, you need the setting option in Button.

See here: https://datatables.net/reference/button/pdfHtml5

Here is an example of how to initialize a new font in a DataTable

  $("table").DataTable({ buttons: [ { extend: 'pdf', className: 'btn green btn-outline', text: 'Export PDF', customize: function (doc) { doc.defaultStyle = { font: 'alef' } } } ] });