Question

185

Export whole html page to pdf using JSPdf generation

rated 0 times [ 190] [ 5] / answers: 1 / hits: 37581 / 10 Years ago, thu, may 8, 2014, 12:00:00

I have already added these js file to my aspx page. But i still couldn't able to get pdf file of my table data. the generated pdf is blank.i need all table data to that generated pdf .please if any one know how to do this?

 <script src=../Script/jspdf.js></script>

        <script src=../Script/FileSaver.js></script>

        <script src=../Script/Blob.js></script>

        <script src=../Script/BlobBuilder.js></script>

        <script src=../Script/deflate.js></script>

        <script src=../Script/adler32cs.js></script>

        <script src=../Script/jspdf.plugin.addhtml.js></script>

        <script src=../Script/jspdf.plugin.from_html.js></script>

        <script src=../Script/jspdf.plugin.split_text_to_size.js></script>

        <script src=../Script/jspdf.plugin.standard_fonts_metrics.js></script>

        <script src=../Script/base64.js></script>

        <script src=../Script/sprintf.js></script>

// Here is my aspx table or div content:

<div id=divReport style=display: none>



            <input type=button id=btnSavePdf value=Save as Pdf />

                   <table id=example>

                <tr id=trProject>

                    <td><span>Project :</span></td>

                    <td><span id=spanProject runat=server></span></td>

                </tr>

                 <tr>

                    <td><span>Total Number of Employee :</span></td>

                    <td>

                    <asp:Label ID=spanTotalEmp runat=server EnableViewState=false  ClientIDMode=Static ></asp:Label>

                    </td>

                </tr>

                <tr>

                    <td><span>Total Number of Hours :</span></td>

                    <td>



                         <asp:Label ID=spanTotalHours runat=server name=_name2 EnableViewState=false  ClientIDMode=Static ></asp:Label>



                    </td>

                </tr>

            </table>

</div>

// Below is my Javascript button onclick code:

$('#btnSavePdf').click(function () {



            var doc = new jsPDF('p', 'in', 'letter');

            var source = $('#divReport').html();

            var specialElementHandlers = {

                '#bypassme': function (element, renderer) {

                    return true;

                }

            };



            doc.fromHTML(

                source, // HTML string or DOM elem ref.

                0.5,    // x coord

                0.5,    // y coord

                {

                    'width': 7.5, // max width of content on PDF

                    'elementHandlers': specialElementHandlers

                });



            doc.output('dataurl');

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

johnnyblaynes

Add To Favorites

Follow

Total Points: 667

Total Questions: 121

Total Answers: 102

Location: Anguilla

Member since Sat, Jan 23, 2021

3 Years ago

answered 10 Years ago kevonmoisesf · Accepted Answer

I assume you want to render the table only instead of the entire page. You can do this using the HTML table export jQuery plugin. This is what your HTML would look like:

<!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd>

<html xmlns=http://www.w3.org/1999/xhtml>

<head>

    <meta http-equiv=Content-Type content=text/html; charset=utf-8/>



    <!-- jQuery 2.0.2 -->

    <script type=application/javascript src=http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js></script>



    <script type=application/javascript src=tableExport.js></script>

    <script type=application/javascript src=jquery.base64.js></script>

    <script type=application/javascript src=jspdf/libs/sprintf.js></script>

    <script type=application/javascript src=jspdf/jspdf.js></script>

    <script type=application/javascript src=jspdf/libs/base64.js></script>

</head>



<body>

<table id=example>

   <!-- rows here -->

</table>    

<a href=# onclick =$('#example').tableExport({type:'pdf',escape:'false'});>As PDF</a>

</body>

</html>