Friday, 1 September 2017

Jquery to PDF Generator


Jquery to PDF Generator

PDF Generator


Steps to make PDF document

  • Add jspdf.min.js
  • Make a divison and put all your HTML content
  • Make a control on call GetPDF function on click event
  • Copy Paste GetPDF Code into your script section


HTML


<div id="content">
      
        <h3>Steps to make PDF document</h3>
        <ul>

            <li>Add jspdf.min.js</li>
            <li>Make a divison and put all your HTML content </li>
            <li>Make a control on call GetPDF function on click event</li>
            <li>Copy Paste GetPDF Code into your script section</li>
        </ul>
    </div>
    <div id="editor"></div>

    <input type="button" value="Download PDF" onclick="GetPDF()" />

JS Script


<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.4/jspdf.min.js"></script>
<script>
    var doc = new jsPDF();
    var specialElementHandlers = {
        '#editor': function (element, renderer) {
            return true;
        }
    };

    function GetPDF()
    {
     
        doc.fromHTML($('#content').html(), 15, 15, {
            'width': 1000,
            'elementHandlers': specialElementHandlers
        });
        doc.save('sample-file.pdf');
    }
  
</script>