0

I am using php mysql in my html page. Already I have use many div in my page. I have create a print button, and it print my specific div but now I want to use a download button and it download my specific div data as a PDF.

How can it possible?

Carsten Løvbo Andersen
  • 26,637
  • 10
  • 47
  • 77
Atik
  • 1
  • 1
  • write that print code on click of print button thats it ? what's the problem ? have you tried ? – Rahul Mar 16 '17 at 06:45
  • like print page but i want to save it as a pdf .I try it but can't do it .please help me – Atik Mar 16 '17 at 06:47
  • 1
    Hi, Welcome to Stack Overflow. In future consider adding some demonstration code to your questions. It will help people to answer your question faster. – William Patton Mar 16 '17 at 06:52
  • This question is similar to yours and has several highly voted answers with suggestions of how to create PDF files with JavaScript in an html document. http://stackoverflow.com/questions/742271/generating-pdf-files-with-javascript – William Patton Mar 16 '17 at 06:55

2 Answers2

1

jsPDF would be a greate choice for handling this kind of functionality. It's relatively easy and quick to use. Here's a jsfiddle example:

https://jsfiddle.net/nfnneil/aajsr6vn/2/

Usage

I used doc.fromHTML($('#saveThis').html(), 10, 10, {}) and I think that deserves some explanation. Firstly, doc is a jsPDF object that we are using. Arguments goes as follows: HTML content for pdf, padding-x in pdf, padding-y in pdf, and then, finally the settings {}.

The code

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/0.9.0rc1/jspdf.min.js"></script>
<div id="downloadThis">
     Rich html <b>features</b> here.
</div>
<div id="editor"></div>
<button id="download">generate PDF</button>

JavaScript

$('#download').click(function () {
        var doc = new jsPDF();
    doc.fromHTML($('#downloadThis').html(), 10, 10, {
        'elementHandlers': {}
    });
    doc.save('download.pdf');
});
Community
  • 1
  • 1
Neil
  • 14,063
  • 3
  • 30
  • 51
0
 <div id="content">
 <h3>Hello, this is a H3 tag</h3>

 <p>a pararaph</p>
 </div>
<div id="editor"></div>
<button id="cmd">generate PDF</button>
 <script>
var doc = new jsPDF();
var specialElementHandlers = {
'#editor': function (element, renderer) {
    return true;
}
 };

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

For downloading ....^

AKSHAY CHATTERJEE
  • 11
  • 1
  • 1
  • 4