js window.open then print()
checkout:
window.print() not working in IE
Working sample:
http://jsfiddle.net/Q5Xc9/1/
how to open a page into a new window and print it
Below code is working for mine.
<html>
<head>
<script type="text/javascript">
function openNewWindow(){
var newWindow=window.open('redir2.html');
newWindow.focus();
newWindow.print();
newWindow.close();
}
</script>
</head>
<body>
<input type="button" value="Open new window" onclick="openNewWindow()" />
</body>
</html>
Source: http://jsfiddle.net/Q5Xc9/1/
Based on the comment, Given path in the window.redirect is wrong. It should be start with IP address with http.
How to open given url content in a new window as print? in javascript or jquery or asp
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script>
$(document).ready(function () {
$("#testbtn").click(function () {
var newWin = window.frames[0];
newWin.document.write('<body onload="window.print()"><iframe style="position:fixed; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; z-index:999999;" src="https://www.mantisbt.org"></body>');
newWin.document.close();
});
});
</script>
</head>
<body>
<div id="divPaySlip">
<button type="button" id="testbtn">Print</button>
<iframe id="ifrPaySlip" name="ifrPaySlip" scrolling="yes" style="display:none"></iframe>
</div>
</body>
</html>
Got the answer after lot of searches. https://www.mantisbt.org is the url which I want to print in a new tab.(fake url)
Print html/css layout after js window.open
im not sure why, but Bootstrap 3 print work with XS size (col-xs-*), so you can rewrite your popup for print to XS or find css fix for that
JavaScript - opening new window in print mode after document is ready
Way 1 : Try with below code. Added body tag before HTML start and added onload
function on it and defined window.print()
function in body onload
function.
var win = window.open();
//css ltr
win.document.write('<style>body { direction: rtl; unicode-bidi: bidi-override; }</style>');
//insert img
win.document.write('<body onload="javascript:PrintMe()"><img src="assets/imgs/logo.png">' + '<br>');
//insert txt
win.document.write(pdf);
win.document.write('<br>');
win.document.write('<img src="assets/imgs/buttomLogo.png">' + '<br><body>');
function PrintMe()
{
win.print();
win.close();
}
Way 2: Use image event listner image.attachEvent("onload"
var win = window.open();
//css ltr
win.document.write('<style>body { direction: rtl; unicode-bidi: bidi-override; }</style>');
//insert img
win.document.write('<body onload="javascript:PrintMe()"><img src="assets/imgs/logo.png">' + '<br>');
//insert txt
win.document.write(pdf);
win.document.write('<br>');
win.document.write('<img src="assets/imgs/buttomLogo.png">' + '<br><body>');
image.attachEvent("onload", function() {
win.print();
win.close();
});
Related Topics
Change Iframe Src by Clicking a Link
Why Aren't Safari or Firefox Able to Process Audio Data from Mediaelementsource
Bootstrap 3: How to Make Head of Dropdown Link Clickable in Navbar
Make the on Scroll Growing <Path> to Dashed Line
Force Address Bar to Show in Mobile Chrome App
Why Do People Minify CSS and JavaScript, When We Have Gzip
Determine Whether Element Has Fixed or Percentage Width Using JavaScript
Implementing Flipcard on Click Instead of on Hover
How to Dynamically Adjust CSS Stylesheet Based on Browser Width
Include CSS and JavaScript in My Django Template
Export SASS/Scss Variables to JavaScript Without Exporting Them to CSS
Ie Thumbnail Pixelation When High Resolution Image Is Set to Small Size