JavaScript: Print as PDF with dynamic table and multiple columns and rows

Question

I have a table with multiple columns and dynamic that depends on data, the column will added.

Screen Shot table header.

Screen Shot print output.

This code I am using.

$("input[id='printData']").on("click", function () {
    var restorepage = document.body.innerHTML;
    var printcontent = document.getElementById("dvContainer").innerHTML;
    document.body.innerHTML = printcontent;
    window.print();
    document.body.innerHTML = restorepage;
});

Question:

How can I print table in full width and get all the columns?

Idea is to convert font size to fit and table size but don't know how to do in print method. Any suggestions what is the best way to fixed this problem?

Answer 1

Larger paper jokes aside, if you content doesn't fit the paper it just won't fit.

You can reduce the content size by removing padding, margins, borders, font-size, and most importantly content itself.

Use media queries to style print formats, you can find many posts on StackOverflow such as this and this.

If reducing the formatting doesn't give you enough space I would recommend removing non-essential content.