2

I am using jsPDF it works fine. It downloads the document as "PDF" but the thing is I am getting wrong design for the same, I want the table as displayed on the site.

How to set the column height and width for table in jsPDF?

Here is my script

function exportPdf()
{
    var pdf = new jsPDF('p', 'pt', 'letter');
    // source can be HTML-formatted string, or a reference
    // to an actual DOM element from which the text will be scraped.
    source = $('#infobox')[0];

    // we support special element handlers. Register them with jQuery-style 
    // ID selector for either ID or node name. ("#iAmID", "div", "span" etc.)
    // There is no support for any other type of selectors 
    // (class, of compound) at this time.
    specialElementHandlers = {
        // element with id of "bypass" - jQuery style selector
        '#infobox': function (element, renderer) {
            // true = "handled elsewhere, bypass text extraction"
            return true
        }
    };
    margins = {
        top: 10,
        bottom: 10,
        left: 10,
        width: "100%"
    };
    // all coords and widths are in jsPDF instance's declared units
    // 'inches' in this case
    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) {
        // dispose: object with X, Y of the last line add to the PDF 
        // this allow the insertion of new lines after html
        pdf.save('musterData.pdf');
    }, margins);
    return false;
}
István
  • 5,057
  • 10
  • 38
  • 67
Nilesh Solanki
  • 99
  • 3
  • 11

1 Answers1

0

I have posted a sample code on something related to your question.. That code will export html table to PDF format using jsPDF tool

Look for the following lines

doc.cellInitialize();

. . .

doc.cell(leftMargin, topMargin, cellWidth, rowWidth, cellContent, i)

Following is the link to find the sample code I was talking about

How to set column width for generating pdf using jsPDF

If you do this way you will get the tabular format in PDF. Let me know if you have any questions.. Don't forget to vote if you find it helpful

Community
  • 1
  • 1
Vinu
  • 336
  • 2
  • 7
  • Hello Vinu My table column is not fixed also the size of column is different. I am using http://jsfiddle.net/xzZ7n/18/ example Here i am getting pdf but the width of table is short and it not fits the pdf page width – Nilesh Solanki May 05 '14 at 09:37
  • Hi Nilesh, Sorry for late response. I wanted to know 2 things ---- First if you have already solved it? Second, I had a look through your code and noticed that you are initializing the PDF with 'pt' as units [that is in this line var pdf = new jsPDF('l', 'pt', 'a4');] and setting the Margin in Inches as mentioned in your comments? Please let me know if that is intentional – Vinu Jun 19 '14 at 20:25
  • Not solved but used server side pdf script using php but still having this issue..actually in jspdf as per my assumption "pt,in,cm" these units are assign at the start of the initialization "var pdf = new jsPDF('l', 'pt', 'a4');]" (here l-landscape,pt-unit,a4-page)that's why i used pt....my main concern is my table is having 35 column in horizontal....but when i used jspdf above example it only generate 20 to 25 column on landscape page – Nilesh Solanki Jun 20 '14 at 07:08
  • Ok Nilesh. Please check the following link where you can find summary of class, fields and methods of JSPdf. It might be useful to you. It says about unit as Measurement unit to be used when coordinates are specified. One of "pt" (points), "mm" (Default), "cm", "in". – Vinu Jun 24 '14 at 15:56
  • Link I was talking about is [given here](http://mrrio.github.io/jsPDF/doc/symbols/jsPDF.html#constructor). And coming to actual problem, I had to use JSPdf library for just about 15 columns with varying column widths. It was either too small or exceeding the landscape view of PDF, so I had to write to calculate the length of the column names and its row value width by looping and set the maximum length. In some cases I split the words so that it gets displayed in next line within same column. You too try to calculate column width dynamically and it might help – Vinu Jun 24 '14 at 17:07