HTML table to pdf using javascript

Question

I have created an appliction for downloading a html table to pdf using javascript i used jsPDF plugin. The application is working fine but the problem is that the table is not proper. The width of the table as well as the header is not properly alligned. I am using angularjs for creating the table.

Can anyone please give me some suggestion for this problem

JSFiddle

function demoFromHTML() {
    var pdf = new jsPDF('p', 'pt', 'letter');
    source = $('#customers')[0];
    specialElementHandlers = {
        '#bypassme': function (element, renderer) {
            return true
        }
    };
    margins = {
        top: 4,
        bottom: 4,
        left: 4,
        width: 522
    };
    pdf.fromHTML(
    source, // HTML string or DOM elem ref.
    margins.left, // x coord
    margins.top, { // y coord
        'width': margins.width, // max width of content on PDF
        'elementHandlers': specialElementHandlers
    },

    function (dispose) {
        pdf.save('Test.pdf');
    }, margins);
}

stackoverflow.com/questions/21280055/…

mb21
– mb21

2014-09-29 12:39:31 +00:00
Commented Sep 29, 2014 at 12:39 — mb21
– mb21, Commented Sep 29, 2014 at 12:39
is that something to be do with css

Alex Man
– Alex Man

2014-09-29 12:41:57 +00:00
Commented Sep 29, 2014 at 12:41 — Alex Man
– Alex Man, Commented Sep 29, 2014 at 12:41

mb21 · Accepted Answer · 2014-09-29 13:17:01Z

4

I guess you currently have to do that manually (fiddle):

function demoFromHTML() {
    var pdf = new jsPDF('p', 'pt', 'letter');

    pdf.cellInitialize();
    pdf.setFontSize(10);
    $.each( $('#customers tr'), function (i, row){
        $.each( $(row).find("td, th"), function(j, cell){
            var txt = $(cell).text().trim() || " ";
            var width = (j==4) ? 40 : 70; //make 4th column smaller
            pdf.cell(10, 50, width, 30, txt, i);
        });
    });

    pdf.save('sample-file.pdf');
}

answered Sep 29, 2014 at 13:17

mb21

40.3k8 gold badges130 silver badges158 bronze badges

Sign up to request clarification or add additional context in comments.

10 Comments

Alex Man Over a year ago

but why provider is seen out of the table

mb21 Over a year ago

because "Customer Plan Provider" is longer than 70pt. Here's a version that splits the words by spaces and puts newlines in instead: jsfiddle.net/00cvyyuo/2

Alex Man Over a year ago

one more issue is that how to remove that empty row

mb21 Over a year ago

the empty row is already in the HTML, you should remove it there.

Alex Man Over a year ago

since its been generated by angularjs thrid party plugin, i cant remove it.......can we do it from the javascript

|

Rira Dev · Accepted Answer · 2020-06-05 08:44:09Z

0

try "jspdf" instead of "jsPDF"

answered Jun 5, 2020 at 8:44

Rira Dev

1

1 Comment

Homungus Over a year ago

that wont help.

Collectives™ on Stack Overflow

HTML table to pdf using javascript

2 Answers 2

10 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

10 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related