CODEWITHSUNDEEP
javascripthtmlcsspdfdom
YUVRAJ JWALA
YUVRAJ JWALA

Reputation: 23

How to print pdf page with css property?

function printDiv() {
   var divContents = document.getElementById("box2text").innerHTML;
   var a = window.open('', '', 'height=500, width=500');
   a.document.write('<html>');
   a.document.write('<body > <h1>Div contents are <br>');
   a.document.write(divContents);
   a.document.write('</body></html>');
   a.document.close();
   a.print();
}

This is html code which i am using

 <div class="box2" id="box2">
    <textarea name="box2text" id="box2text" cols="30" rows="10"></textarea>
 </div>
 <div class="button">
    <button onclick="printDiv()">PRINT</button>
 </div>

This print only text I want text with its css property like color

Upvotes: 1

Views: 1478

Answers (1)

amirify
amirify

Reputation: 805

You can create a blank html page (print-page.html) which has your css linked to it. and use the following code to open it and insert your content inside and then print the content:

function printDiv() {
    var divContents = document.getElementById("box2text").innerHTML;
    const printWindow = window.open('print-page.html', '_blank', `width=${window.innerWidth},height=${window.innerHeight}`);
    printWindow.onload = function(){
        printWindow.document.body.innerHTML = divContents;
        printWindow.print();
    }
}

Upvotes: 1

Related Questions