Parent iframe with FireFox doesn't work? - javascript

I'm trying to change de value of an input variable (located in the parent or main window) from an iframe. It works fine in IE8, Chrome or Safari, but not in FireFox...
This is my code:
parent.NameOfTheInputVariable.value=_value_;
What am I doing wrong? I've read that firefox doesn't accept the "parent" window... how can I access the main window?

The problem is not the parent, but assuming that there will be a global variable just because something has a name. That is a non-standard IEism that WebKit has adopted (although I think it may only work in Quirks mode, which is best avoided anyway).
parent.document.getElementsByName('NameOfTheInputElement')[0].value = ...;
… should do the job.

Related

IE11 quirks mode under Iframe - javascript errors

I am reading and looking for answer for days and couldn't found one, hopefully this thread will bring salvation :)
In my company we have a web app that is working on IE8.
We are trying to migrate to IE11.
We almost there but,
We have an old module that is written in an old framework that is hosted in an iframe and running in quirks mode(define with meta http-equiv="X-UA-Compatible" content="IE=emulate7" or IE=5, I tried both).
As long as the parent/main window is rendered in IE8 document mode (via x-ua-compatible meta tag) or in enterprise mode, the iframe works fine.
But as soon as I change the parent/main window to IE=9 and above, I get javascript errors from the child iframe (more than I can handle).
I understand that IE11 uses emulator for quirks mode and not the real engine, but I can not find anywhere details about the javascript engine.
Does this mean that if the parent main window is rendered is IE9 and above, the child iframe will use ECMAscript 5 and not jscript as it should?
is there any solution to my problem?
thanks guys!
Starting with IE10, the child mode can be different from the parent.
See this link. It says...
IE9 mode displays the child frame in standards mode (because the
parent document is in standards mode). Starting with Internet Explorer
10, however, child frames can emulate quirks mode. For more info, see
IEBlog: HTML5 Quirks mode in IE10. For best results, however, use
document modes consistently.
Starting with IE9, frames were limited to the document of the parent document, e.g. if the parent document rendered in standards mode, child frames were forced to render likewise.
Perhaps one approach would be to revise things so that your IE9+ window presents links to open your legacy app in a new parent window, one that presents whatever document mode your child frame requires.
You can use showModelessWindow to open a child window containing a separate HTML file, one that initiates the correct document mode in the parent document...and then loads the IFRAME you're working with. Example code:
var sOptions = "scroll: no; status: no; resizable: yes;";
window.showModelessDialog("myFrameContainer.html", "", sOptions );

IE9 window object inside an Iframe has no addEventListener

I'm adding an Iframe to a page by using javascripts document.write. The page (from another domain) that is called inside the Iframe does a bit of setup using
window.addEventListener('load', function() {
//do stuff here
}
It works in Chrome. It works in Firefox. It works in Opera.
It doesn't work in IE9. I get the strangest message, that "the Object does not have the property or method 'addEventListener'". It's apparently the window object IE9 is talking about, because when I
console.log(window)
i get
[object Window]
but when I
console.log(window.addEventListener)
I get
undefined
When I call the page directly the script works fine, but in the Iframe I get this magical castrated window object that does not know addEventListener (and probably other stuff too)?! What the hell is happening here?
After much trial and error I found out that the page that was creating my Iframe had broken HTML (no Doctype, no title tag) and thus forced IE9 into Quirks mode, which apparently means reduced abilities. After cleaning up the loading page it works fine.

what's the line meaning in javascript?

if (document.all)
document.body.style.behavior='url(#default#homepage)';
if (window.sidebar)
What's those lines meaning in javascript? thank you.
Don’t use document.all:
if (document.all) {
element = document.all[id];
else {
element = document.getElementById(id);
}
document.all was introduced in Internet Explorer 4, because the W3C DOM hadn’t yet standardised a way of grabbing references to elements using their ID.
By the time IE 5 came out, document.getElementById() had been standardised and as a result, IE 5 included support for it.
More info here..
document.body.style.behavior='url(#default#homepage)' is used to set current page as home page in the IE.
if (window.sidebar) is a check for firefox
document.all is used to check if the browser is IE
if (document.all): used to check if the brower is IE, but note this is bad practice because it is no longer a good method of doing the test.
if (window.sidebar): test if the browser is Firefox.
EDIT: document.body.style.behavior='url(#default#homepage)'; is most likely used to set the homepage when the browser is IE. However, it does not seem to work well with Firefox and the others.
Statement 1 tries to detect if the browser is IE and statement 2 uses an IE-only API: behavior property.
However, document.all is not IE-only feature. It also exists on Chromium/Chrome and other WebKit based browsers.
Therefore, statement 1 get passed on IE & Chrome, but statement 2 only works on IE.

In IE, when binding to the 'load' event of an IFRAME, this.contentDocument is undefined

Ok, bear with me folks, the setup on this one is long.
I have a simple page. It loads an iframe. Inside that iframe is a form. I want the form inside the iframe to interact with the parent page via jQuery.
This works correctly in Firefox, Chrome, and Safari. See for yourself here:
http://dl.dropbox.com/u/58785/iframe-example/index.htm
However, in Internet Explorer 6/7/8/9, it does not work. The load event fires, but jQuery cannot get a handle on elements inside the iframe.
I'm using the second 'context' argument of the jQuery function to set the context of the selector, like this: var form = $('#myform'), this.contentDocument)
Here's what is batty. Using the F12 Developer Tools in IE9, I can set a breakpoint in my JavaScript and look at how IE is evaluating the JavaScript. If I hover over this, I can see that it does have a contentDocument property. BUT, if I hover over this.contentDocument, it tells me it's undefined.
Because it's undefined, the jQuery selector returns no elements. Again, this is only in IE. And the IFRAME is on the same domain, so it's not a same-origin issue.
Any pointers?
Not to trample on Roatin's answer, but this issue can also be fixed by specifying a DOCTYPE declaraction. Internet Explorer 8 and over require it for contentDocument. Otherwise, as he said, contentWindow can be used (for earlier versions of IE, too). See the information at W3Schools.

Calling a function in an iframe from a parent in firefox

I'm trying to call a function, test(), of an iframe from the parent document using the code
subframe.test();
subframe refers correctly to the iframe, alert(subframe) returns [object HTMLIFrameElement], and the function runs in both IE7 and opera (9.23), but not firefox (3.0), chrome (3.0) or safari (3.03 beta windows). I assume these browsers support the functionality, so wondering if perhaps I'm using an incorrect call which IE and Opera support anyway, which wouldn't surprise me.
Thought I should answer for posterity - I solved the problem using subframe.contentWindow.test() .
Is the domain of the parent document's source the same as that of the child iframe's? I believe FireFox requires that they are in order to do something like this.

Categories

Resources