'convert particular portion div to pdf
I have an order form where users place orders and after placing their orders, their is an invoice that is generated with jquery which they are asked to print. I want to be able to take only that div that contains the invoice on the page submit it to an engine or something that will now convert it to pdf, its a table structured order print out. And also how do i make only that portion available when printing so that the printout contains only the order invoice and hides all other potions of the page. Pseudocode:
Function make_pdf($html){
// run thought the submitred html
// create pdf version
// make available for download.
}
Solution 1:[1]
You will need some sort of PDF generator to run server side that you post the necessary information to. There are a few common PDF generator libraries out there, however I am not sure of their capabilities. Check out this post:
The easiest thing to do would be to find one that supports HTML to PDF conversion and just post the html markup directly to the server via ajax etc. Otherwise without the conversion, you will have to pass the raw data from the form and template the PDF server side, while inserting the data in the relative placeholders. Then just output the PDF back to the client with the correct headers allowing the user to download the file.
eg: header('Content-type: application/pdf');
Solution 2:[2]
Use the print button to call a function.
- Add a javascript function at the
onclickevent of the print button. Get the content of the receipt div ( using jquery:$('#receipt').html()or javascriptdocument.getEmementById('invoice').innerHTML'). Add this content to a hidden variable in a form. Submit the form to a dedicated php file. (
<form target='_blank') You got the the post data in the dedicated php file.$html = $_POST['hiddenHtml'];$pdf->writeHTML($html, true, false, true, false, '');
Solution 3:[3]
You can use jQuery Print Element from here. When printing a div, you just have to call the plugin's function:
$('#invoiceContainer').printElement();
You can pass the div id that containts the invoice, then you can save it as pdf.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | Community |
| Solution 2 | Anew |
| Solution 3 |
