We Keep Coding

why window.onload not fire in IE

I have some code to open a popup, then resize the it via certain element on the popup page. The following code work fine in Chrome and Firefox, but not IE.
var newWin ;
function openWindow(id) {
newWin = window.open(url,config,setting);
newWin.onload= function () {
newWin.resizeTo(newWin.document.getElementById("certainID").offsetWidth,100);
};
In IE10 a popup will come but the window.load event will never fire.
I also try newWin.$(document).ready , but seems it is invalid.
Any suggestion?

This is an old problem in IE.
One of the best solution is to add new.
Normally we write
window.onload=function() { alert('hello');};
Replace it with
window.onload=new function() { alert('hello');};

Finally I resolve this via setTimeout to check whenever the element in popup is well-generated, then resize the popup window
var newWin ;
function openWindow(id) {
newWin = window.open(url,config,setting);
var resizePopup = function () {
newWin.resizeTo(newWin.document.getElementById("certainID").offsetWidth,100);
newWin.focus();
};
var tryResize = function(){
if(newWin.document.getElementById("certainID")==null){
setTimeout(function(){tryResize();},500);
}
else{
resizePopup();
}
}
tryResize();
};

If using setTimeout, may be popup perform resizing when window not finish loading yet. I think best solution is using setInterval and check whenever document.readyState==='complete" => call clearInterval() and run resize

In popup document.getElementById(tur).value it is coming in IE but isnt coming in Chrome

My problem is with popup. I use document.getElementById(tur).value in popup but it is workin in IE but isnt working Chrome. i wrote alert but didnt anything.
function birimSec(tur,id,txt)
{
alert(document.getElementById(tur).value);//doesnt work
document.getElementById(tur).value=id;
document.getElementById(tur+'ACK').value=txt;
if(document.getElementById(tur).onchange != null)
document.getElementById(tur).onchange();
}
'tur' is coming correct and it is working in IE but in Chrome doesnt working wh ?
thans for everything.

What code is used to call this? The problem is more likely to be there than in the function itself.

i used this code and it is working now :)
var win = ifrm.contentWindow; // reference to iframe 2 window
// reference to iframe 2 document
var doc = ifrm.contentDocument? ifrm.contentDocument: ifrm.contentWindow.document;
// reference to form element in iframe 2 document
var fld = doc.forms['formName'].elements[tur];
var counter = win.counter; // global variable in iframe 2
win.clearGreeting(); // call function in iframe 2
the iframe in parent page. thanks everybody

What's this Javascript condition checking?

An ad provider wants us to add some Javascript to our site that'll allow them to resize the iframe their ad is served into. I've been going through the code, and part of it is this loop:
var topIframes = top.document.getElementsByTagName('IFRAME');
for (var i = 0; i < topIframes.length; i++) {
if (topIframes[i].contentWindow === self) {
// found iframe that served the ad
topIframes[i].style.height = sz + 'px';
}
}
I can see it's grabbing all the iframes in the document and adjusting the height of one or more of them. But I can't figure out what the condition's doing.
I know contentWindow's the window inside an iframe, and looking at What's the difference between self and window? I see that "self" is a reference to the window object. But which window object? The parent window or the window inside the iframe? Is there even a window inside the iframe? Why check that the window inside an iframe is the window inside an iframe?
////////////////////////////////////////////
EDIT
At Snuffleapagus's request, here's the long version:
<script type="text/javascript">
// iframe shrink function that needs to be on the hosting page
rp_resize = function (sz) {
try {
var topIframes = top.document.getElementsByTagName('IFRAME');
for (var i = 0; i < topIframes.length; i++) {
if (topIframes[i].contentWindow === self) {
// found iframe that served the ad
topIframes[i].style.height = sz + 'px';
}
}
} catch (e) {
}
}
</script>
<script>
// this is the code that goes in the passback to initiate the function
try {
if (typeof(rp_mpu) === 'function') {
rp_resize(250);
}
} catch (e) {
}
</script>
<script language="JavaScript" type="text/javascript">
rp_account = '<account-id>';
rp_site = '<site-id>';
rp_zonesize = '<zone-id>-<size-id>';
rp_adtype = 'js';
rp_smartfile = 'http://<url>/..../revv_smart_file.html'; // this should be the URL path to the friendly iframe that needs resizing
</script>
<script type="text/javascript" src="http://ads.<url>.com/ad/<account-id>.js"></script>
////////////////////////////////////////////
EDIT
Here's a possible clue from the ad provider in answer to my question about the condition. Don't know how much use it is, as he's not a developer.
"The line of code you are looking at is trying to determine if it is the iFrame from which the function has been initiated so it can be resized accordingly."

From what I understand working with Javascript and how it can access iFrames, the provider is assuming that you have multiple iFrames on the page. Also, it assumes that the iFrame they are looking for does not have an ID to reference easily.
Based on this, after the frame with the ad content loads, at some point it will call rp_resize(250);. However, the function rp_resize does not know which of the iFrames on the page it was called from. The script loops through all the iFrames on the page until it finds the one that called the function. This is how it knows which frame to call.
Hopefully that makes sense and / or answers your question.

I think, self refers to the parent window. To check, type the following in your browser console and see the result :
self == window

.contentWindow will return null if the iframe hasn't completely loaded. It looks like the code is looping through iframes, checking if they are loaded, and if so, resizing them.
Edit: musefan is right; I worded it incorrectly.
Edit 2: Why check that the window inside an iframe is the window inside an iframe? It's null if it's not loaded yet; if it is loaded, it's a window.

top.opener.location.reload(true) not refreshing parent page on IE

I have two pages, the parent and from this page I am using:
window.open('OrderDetailsFull.aspx?ObjectID=' + ObjectID[1] , "TableDetails","status=0 , toolbar=0 , location=no , menubar=0 , scrollbars=yes , height=600px , width=800px");
to open a new window and manipulate data over there.
When I finish what I am doing I need the parent page to refresh so I will get the new data data in it...
From what I know the method is:
top.opener.location.reload(true);
but for some reason, it is not working in IE8 or IE9...
As I am building an application and not a general web page. It will work on Windows OS with IE (as for now it is still the most common system...nothing to do about it) so I really need to solve this problem....
I couldn't find any new solution over the web for this problem, every one say it should work like that.....
Did anyone encounter this problem? and does any one knows how to solve it?
OK, FOLLOW UP question: when I do opener.location.reload(true); does it render the parent page all over again (as it sound) or not? If it does then I'm in a big problem, if not, then there must be a way to do that...
The problem is the I have an ajax call in the parent page and for some reason it stays in it's old values when I am using it, only when I reload the child window, the parent ajax shows the real results, some code follows...
This is in the document ready jQuery function of the opener page:
$('div[id^="divTable"]').hover(
function(e){
//קבלת זהות השולחן הנלחץ
ObjectID = $(this).attr('id').split('_');
$(this).css("cursor","pointer");
//AJAX הבאת נתוני רשומת ההזמנה מהשרת ב
var OrderDetails = $.ajax({
url:'AjaxActions/OrderDetails.aspx?ObjectID=' + ObjectID[1],
async:false
}).responseText;
//צף מעל שולחן כשעומדים עליו, ניתן לראות את פרטי הרשומה של אותו השולחן DIV
$(this).append($('<div style="position: absolute; top: 0; left: -150;">' + OrderDetails + '</div>'));
//וידוא שהשולחן עליו אנו עומדים יהיה העליון
$(this).css("z-index","10");
$(this).siblings().css("z-index","1");
},
//כשיוצאים מהשולחן DIVהעלמת ה
function () {
$(this).find('div:last').remove()
}
);
This is in one of the functions in the child window that should refresh the opener:
$('#ctrl_Print').click(
function()
{
alert($('#hidItem').val());
var Items = new Array();
Items = $('#hidItem').val().split(',');
for(var i=0;i<Items.length;i++)
{
alert(Items[i]);
}
opener.location.reload(true);
window.location = 'OrderDetailsFull.aspx?OrderID=' + OrderID + '&ObjectID=' + ObjectID + '&Print=' + Items;
window.close();
}
);
10x...

It looks like IE 8 and 9 have security restrictions on refreshing the opener.

I've run into this problem where reload() works in Chrome, but pukes in IE.
Try using window.location.replace(your url and params here).
You have to collect the url and params for replace(), but it gets around the IE error message.
Example:
In Joomla 2.5 parent window launches modal for users input, where we need to reload the parent window (view) in order to run code that uses modal input.
The modal fires a function in the parent window like;
function updateAddresses(runUpdate, itemID, closeModal){
if(closeModal == true ){
SqueezeBox.close();
}
if(runUpdate == true){
//location.reload();
var replaceURL = 'index.php?option=com_poecom&view=cart&ItemId='+itemID;
window.location.replace(replaceURL);
}
}

top is used to get the outermost document within the current physical window when you're dealing with framesets and/or iframes and is not related to window.open in any way, so you shouldn't use top unless there are frames or iframes within your pop-up page. The following will do:
opener.location.reload(true);

If you want to access the parent window (or frame), you should use parent, not top:
parent.location.reload(true);
When your page is a frame inside that window, add more parents to it:
parent.parent.location.reload(true);

Reporting child window's events to parent window to reset timer value of user timeout code

I've got a Jquery function that I wrote which blacks out the screen after a certain amount of inactivity, creates a pop-up that allows the user to click a button to stay logged in, and logs them out (closing the application window) if they do not respond in time.
The environment is ASP.NET (VB). We don't technically use master pages, but we do have a parent page in which our header, footer and nav reside, and my Jquery code is called from that window, loaded via an IFrame.
My problem is that if one is working in a child window, the parent window doesn't recognize that the system is in use, and will automatically engage at the allocated time.
I've tried everything under the sun I can think of and nothing works properly. My event handler is working, and it does call the parent window function, but the timer is not being reset.
I have this function in the parent window:
<script language="javascript" type="text/javascript">
function window.reportChildActivity() {
SESSION_ALIVE = true;
window.setTimeout("pop_init()", SESSION_TIME);
}
</script>
And this in the child window:
<script type="text/javascript">
$(document).bind("mousedown keydown blur", function() {
window.parent.reportChildActivity(); });
</script>
No matter how much I click or use keys in the child window, my Jquery timeout code is called when SESSION_TIME runs out the first time. And then I get multiple Jquery windows in my page telling me to click to continue. It's like the events are being buffered and when they fire these windows are all being spawned multiple times. Does anyone see from this what I'm doing wrong? Thanks!
---- EDIT -----
I'm adding my pop_init function and supporting functions for reference:
// remove all added objects and restart timer
function popup_remove() {
$("#popup_window").fadeOut("fast", function() { $('#popup_window,#popup_overlay').trigger("unload").unbind().remove(); });
//if (typeof document.body.style.maxHeight == "undefined") {//if IE 6
$("body", "html").css({ height: "auto", width: "auto" });
$("html").css("overflow", "");
//}
window.setTimeout(pop_init, SESSION_TIME);
}
// session ajax call from button click
function session_refresh() {
SESSION_ALIVE = true;
$(".buttons").hide();
$("#popup_message").html("<center><br />Thank you! You may now resume using the application.<br /></center>");
window.setTimeout(popup_remove, 1000);
$("#popup_window").fadeOut("slow", function() { $('#popup_window,#popup_overlay').trigger("unload").unbind().remove(); });
window.setTimeout(pop_init, SESSION_TIME);
}
function popup_expired() {
if (!SESSION_ALIVE)
window.close();
}
// Main popup window handler
function pop_init() {
// show modal div
$("html").css("overflow", "hidden");
$("body").append("<div id='popup_overlay'></div><div id='popup_window'></div>");
//$("#popup_overlay").click(popup_remove); // removed to make sure user clicks button to continue session.
$("#popup_overlay").addClass("popup_overlayBG");
$("#popup_overlay").fadeIn("slow");
// build warning box
$("#popup_window").append("<h1>Warning</h1>");
$("#popup_window").append("<p id='popup_message'>Your session is about to expire. Please click the button below to continue working without losing your session.</p>");
$("#popup_window").append("<div class='buttons'><center><button id='continue' class='positive' type='submit'><img src='images/green-checkmark.png' alt=''/> Continue Working</button></center></div>");
// attach action to button
$("#continue").click(session_refresh);
// display warning window
popup_position(400, 300);
$("#popup_window").css({ display: "block" }); //for safari using css instead of show
$("#continue").focus();
$("#continue").blur();
// set pop-up timeout
SESSION_ALIVE = false;
window.setTimeout(popup_expired, 30000);
}

try assigning the setTimeout to a global variable and clearing it each time eg:
var timer=false;
window.reportChildActivity = function() {
if(timer!==false) {
clearTimeout(timer);
}
SESSION_ALIVE = true;
timer=window.setTimeout(pop_init, SESSION_TIME);
}
example: http://jsfiddle.net/pB2hX/1/