How Button click to print "divPrint" section?

Question

My Code Intenational Chemical Laboratory Pune - 411008 India (EPABX:+91(0)20-25902905 25908901; Fax:+91(0)20-29902660) REQUEST FOR HOUSE ACCOMMODATION Print

Vijay Pratap Singh · Answer

You can use JavaScript to create a function called printdiv() that will print the content of the divPrint section. Here's an example of how you can do it Print Div Example Intenational Chemical Laboratory Pune - 411008 India (EPABX:+91(0)20-25902905 25908901; Fax:+91(0)20-29902660) REQUEST FOR HOUSE ACCOMMODATION Print function printDiv() { var printContents = document.getElementById(divPrint).innerHTML; var originalContents = document.body.innerHTML; document.body.innerHTML = printContents; window.print(); document.body.innerHTML = originalContents; } Hope this will help

Mithun Pradhan · Answer

My code print window not open propper need to like open('' '' 'letf=0top=0width=800pxheight=1000pxtoolbar=0scrollbars=0Status=0'); .img-section { float: left; width: 30%; } .div-main-header-section { float: left; width: 45%; text-align: center; margin-top: 20px; } .heading-font-color { font: bold 22px Arial Helvetica sans-serif; color: #4F81BD; } .heading-font-size { font: bold 15px Arial Helvetica sans-serif; } .div-guest-section { padding: 5px 5px 5px 15px; } .div-content-position { margin-top: 18px; } .div-left { float: left; width: 50%; } .label-font { font-weight: bold; width: 45%; } .left-label-font { font-weight: bold; width: 22%; } .status-message-position { display: inline-block; width: 76%; margin-left: .5rem; } .label-right { width: 100%; text-align: right; } @@media print { body * { visibility: hidden; } #divPrint #divPrint * { visibility: visible; } #divPrint { position: absolute; left: 0; top: 0; } } Intenational Chemical Laboratory Pune - 411008 India (EPABX:+91(0)20-25902905 25908901; Fax:+91(0)20-29902660) REQUEST FOR HOUSE ACCOMMODATION Name of Requestor Dr. Test Test Phone 1234567890 Email Id testtest@gmail.com Designation Test Test Test Mobile 9930828002 Fax 25204569 Booking Status Active Admin Comment This tutorial contains hundreds of Bootstrap 5 examples. With our online editor you can edit the code and click on a button to view the result. Incharge Guest House Print function printDiv() { var printContents = document.getElementById(divPrint).innerHTML; var originalContents = document.body.innerHTML; document.body.innerHTML = printContents; window.print(); document.body.innerHTML = originalContents; }

Naimish Makwana · Answer

You can print a specific div using CSS and JavaScript. You can hide all other elements when printing by using a print media query. Here’s how you can do it: First add this CSS to your stylesheet: @media print { body * { visibility: hidden; } #divPrint #divPrint * { visibility: visible; } #divPrint { position: absolute; left: 0; top: 0; } } This CSS will hide everything on the page except for the divPrint div and its inner elements when printing. Then modify your printDiv function like this: function printDiv() { window.print(); } Now when you click the “Print” button only the divPrint section will be printed. Please note that the actual printing will depend on the user’s browser settings and printer configuration. Thanks

Jignesh Kumar · Answer

Hello Mithun Please create jquery method to print div as below function printDiv() { var divToPrint=document.getElementById('divPrint'); var newWin=window.open('''Print-Window'); newWin.document.open(); newWin.document.write(' '+divToPrint.innerHTML+' '); newWin.document.close(); setTimeout(function(){newWin.close();}10); }