Here i'm going to explain you one the most interesting and useful tutorial, that is Save or download the particular div as in the PDF format onclick using jsPDF jquery file. This is very simple one. i already showed you one tutorial to save and print the whole web page. here for the particular div. let see the code.
Here we need add jquery file. for this save the particular div place as in .pdf format using jquery. for more reference click here
HTML CODE
<h1 align="center" id="download" class="glyphicon glyphicon-download" style="cursor:pointer;" title="Click to Download"></h1> <section id="posts-landing"> . . . . . . .................... Content goes here, this thing will be pdf format ................ . . . . . . </section>
JQUERY AND SCRIPT
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script type='text/javascript' src="jspdf.debug.js"></script> <script> $(document).ready(function() { $('#download').click(function () { var pdf = new jsPDF('p', 'pt', 'letter') , source = $('#posts-landing')[0] , specialElementHandlers = { '#bypassme': function(element, renderer){ return true } } margins = { top: 60, bottom: 60, left: 40, width: 522 }; // 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('Downloaded.pdf'); }, margins ) }); }); </script>
That's all. make sure that div id or class should be same and we have to add that jquery files too. thanks for this attention. Keep visiting for more tutorial like this.
RELATED POSTS :
PHP is strong and advanced laguage and its supports many databases. Hire PHP developers from a skilled and experienced PHP web development company which provides excellent PHP development services.
ReplyDeleteAwesome post bro I have used this code. Thank you
ReplyDeleteНе понимает язык RUS
ReplyDeleteНЕ РАБОТАЕТ С РУССКИМ ТЕКСТОМ ПЛОХО
ReplyDeletenice tutorial, but how i can save particular div in .png(image) format, any help will be appreciated .....
ReplyDeleteCheck your demo's.
ReplyDeleteError: jsPDF is not defined
protocol "blob" is unknown??
ReplyDeleteThank you so much. I'm PBWijerathna from Sri Lanka
ReplyDeleteNice posts, thanks for the solutions. Keep posting more like this.
ReplyDeleteEcommerce Website Development Company in India
Ecommerce Development
You are simply the best! its works awesome! simple/fast/great!
ReplyDeleteThis is an extremely valuable capacity since you can include, erase, and reorder the JPG pictures lastly convert them into a solitary PDF document. https://www.altoconvertpngtopdf.com/
ReplyDelete