CODEWITHSUNDEEP
javascriptjqueryhtmlangularjsprinting
Maxime
Maxime

Reputation: 2234

Print a distant page in JS, JQ, or Angular

I have pages that I have to print, but when I launch printing, the preview is ugly and I can't select and modify the elements I want (there's only few elements I want to print, and others that I hide only for the printing).

I don't succeed to do it with less (with @media print), so I made a template and I inject inside it the elements I want to show for the printing (with AngularJS). The problem is that the original page is something like http://example.com/id/page-name/?tab=media. But I put in my script a listener which catch the print event and redirect the user on http://example.com/id/page-name/?tab=media&print=true.

Then a timeout launches the printing script (window.print()), and when the user leave the printing page, the script redirects him to http://example.com/id/page-name/?tab=media.

The problem is that it makes a lot of closing/opening windows, and it may be uncomfortable for the user. I think my solution is weird and awkward, but I found nothing else to do it...

So do you have a solution to print a distant page, which will not make a lot of closing/opening frames?

For example, when I Ctrl+P on http://example.com/id/page-name/?tab=media, it prints the http://example.com/id/page-name/?tab=media&print=true page, and not the original ?

A thing like document.location.href="http://example.com/id/page-name/?tab=media&print=true".print(); or print('http://example.com/id/page-name/?tab=media&print=true'); ?

I hope it's possible!

Upvotes: 2

Views: 153

Answers (1)

user474901
user474901

Reputation:

you can get some idea from this question angularJS UI tab print selected contend from tab and create print function like

  $scope.print = function (divName) {
    var printContents = document.getElementById(divName).innerHTML;
    var popupWin = window.open('', '_blank', 'width=800,height=700');
    popupWin.document.open()
    popupWin.document.write('<html><head><link rel="stylesheet" type="text/css" href="style.css" /></head><body onload="window.print()">' + printContents + '</html>');
    popupWin.document.close();
}

Upvotes: 1

Related Questions