Francis Francis - 1 year ago 69
CSS Question

Trying to print a div retaining original css content of the div but button is not clicking

I am trying to print a div retaining original css content of the div and here is my attempt

JS :

function printDiv(id) {

var html = "";

$('link').each(function() { // find all <link tags that have
if ($(this).attr('rel').indexOf('stylesheet') !=-1) { // rel="stylesheet"
html += '<link rel="stylesheet" href="'+$(this).attr("href")+'" />';
html += '<body onload="window.focus(); window.print()">+$("#"+id).html()+'</body>';
var w ="","print");
if (w) { w.document.write(html); w.document.close() }


$('#PrintinPopup').click(function(){ printDiv("#print"); });

Assuming that this is the div content.


<div id="print">
<!--div content here-->
<input type="button" id="PrintinPopup" value="Print" />

On clicking the button, nothing happens as no pop up is shown on the window. Please what could be wrong?

Answer Source

You've a missing quote in :

html += '<body onload="window.focus(); window.print()">+$("#"+id).html()+'</body>';

It should be :

html += '<body onload="window.focus(); window.print()">'+$("#"+id).html()+'</body>';

Also remove the '#' since you already send it in the call printDiv("#print") :

html += '<body onload="window.focus(); window.print()">'+$("#"+id).html()+'</body>';

Should be :

html += '<body onload="window.focus(); window.print()">'+$(id).html()+'</body>';

Hope this helps.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download