I am trying to send data to a popup window which opens by clicking a button.
All my code is in php where I include javascript and html, I will just show html and js here.
Consider my popup window (say, popupwindow.html) code as just
<div id = 'getData'></div>
Now on the page(say, main.js) where I put the button clicking which the popup opens, I am computing some data and trying to send it to popupwindow.html.
Here is relevant main.js code that gets executed after clicking the button
var popup = window.open("popupwindow.html", "popup", extraParams); //ignore extraParams
$(popup).on('load', function() {
//console.log("inside onload function");
popup.document.getElementById("getData").innerHTML = data; //here data is some string
});
Now this code works perfectly on Chrome and Firefox, but in IE load() function does not get executed. I know this because the console.log line when uncommented, does not print on the console. Tried versions of jQuery from 1.2.3 to 2.2.1 where the code runs successfully on Chrome and Firefox(but not in IE)
Note: I cannot execute the required code on popup page(popupwindow.html) because of some constraints. I have to write it on main.js and send it to popup.
I saw all other questions which said onload() or similar function in IE gives problems but I still could not find the appropriate solution. Please let me know how I can fix this for IE.
I have a problem with JavaScript and Opera.
I want to fire an JavaScript function onLoad but opera
ignores it when I reload the page or use the back button to come back.
My code looks like this:
HTML
...
<body onload = "doSomething()">
...
//Javascript
if (window.opera)
{
opera.setOverrideHistoryNavigationMode('compatible');
history.navigationMode = 'compatible';
}
...
function doSomething(){
alert("HI");
}
The first time I load the page I get an Alert but if
I reload the page or use the back button to come back I
don't get an alert.
Does anyone know how to fix this problem?
Chrome, Firefox and even IE work fine.
Yes, as the name suggests, I am getting two print dialogs on Chrome latest and FF latest.
The code I'm using is:
var $printButton = $('#print_button');
if ($printButton) {
$printButton.on('click', function () {
window.print();
})
}
The second dialog only opens when I have actioned the first dialog (print or cancel), if that helps.
EDIT:
After narrowing it down to an issue with my callback, I put a console.log('hello'); in the script and found that it was calling twice on refresh.
My script file was being included twice somewhere on the page. Thank you legacy code :)
Thanks for the advice everyone.
I am having an issue with print on Safari. My System is Windows 7, and this function works fine in all other browsers except Safari. Here is the situation:
window.onload = function(){
console.log('before print');
window.print();
}
It won't output the log in console panel, but the print page will appear first, after i choose cancel in print page, the log will be output.
Does any body came up with this issue? Any help will be appreciated.
Updated
Here is the situation i have:
We need to print a page whose content can be changed by user by checking and unchecking check box, and only the content part of this page should be printed, so we create a new page that only contains the content for printing. In this page, we need to hide the unnecessary content that is not selected by user, so we need to do some DOM operation before window.print() get called. The console.log() is just an example code for observing. I tried to add an <div id='test'>Test HTML</div> in test HTML and add
var test = document.getElementById('test');
test.style.background = 'yellow';
before window.print();, it shows the same result in my Safari browser, the 'Test HTML' will not turn to yellow until i click cancel button in print panel, so it's not just the console.log issue.
Updated
I am using Safari 5.1.7(7534.57.2) on Windows 7
For me, the setTimeout solution didn't work. I found this jQuery plugin https://github.com/jasonday/printThis that has plenty of workarounds for window.print() because it seems not to be fully supported by all browsers.
I took this line that worked for me Safari document.execCommand("print", false, null)
and this worked ok for me for now in safari and chrome
try {
document.execCommand('print', false, null);
}
catch(e) {
window.print();
}
This is odd behavior. I tested in Safari 6.1 on Mac.
But may I ask why you need to log something before the printing? Because it seems that all the functions are being executed before the printing panel pops up:
<script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
<script>
window.onload = function() {
$('body').html('before print');
console.log('before print');
window.print();
};
</script>
When you look at the print preview, the page will have the text "before print" on it. For some reason, the console will log the text only when the print panel closes, but in my opinion that doesn't really matter for your visitors. You can manipulate DOM and change the page before the printing process as you like.
After several times trying, below code works, but i don't know the reason, can anybody explain? Or this is a Safari Bug?
window.onload = function() {
$('body').html('After change');
setTimeout(window.print, 1000);
};
Safari prints the page before it is loaded unlike other browsers. Hence window.onload() can be used in the code of the newly opened html page. But if the page opened is non html content, then it is not possible. The below solution is global across browsers and type of content open.
var printWindow = window.open(url, '_blank');
$(printWindow).load(function()
{
this.print();
});
Adding one more solution which worked for my case:
First make your popup window.
$( ".myButton" ).click(function() {
var url = 'www.google.com';
var printWindow = window.open( url, '_blank');
printWindow.focus();
});
Then, inside the HTML page which is loaded in the popup:
$(window).bind("load", function() {
setTimeout( function () {
try {
document.execCommand('print', false, null);
}
catch(e) {
window.print();
}
}, 500);
});
Hello I getting not visible IFrame in IE I try print it, but IE return error what focus() method not identified. Why I get it? I remember that some days ago it wored
var iFrame = document.frames["printIfram"]; //document.frames.printIframe;
iFrame.focus();
iFrame.print();
Put a print function inside the Iframe to make it print itself on load:
At the bottom of the page, just use window.print()
You missed the e on the end of printIframe.
If that's just a typo, try iFrame.contentWindow.focus().
i got the same problem in ie8 and i thought it's a bug of ie
i tryed the accepted answer ,it haven't work yet;
nomatter where is the window.print(),it always print the parent page
so ,i give up the iframe,just open a new tab to print
have you got it work?