JQuery is not loading in an iframe in IE7? - javascript

I have two different web applications in different domains. in web app1, i have an iframe and its src refers a page which is in web app2.The page which needs to be loaded in an iframe has some JQuery.But the problem is it is not loading in an iframe. But if i access the same page in the same web app2 then it is working fine. It works fine in Fire fox and the issue is only with IE. am using IE7.
I have below code in the page which needs to be rendered in an iframe.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js" ></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.0/jquery.validate.js"></script>
Am i doing anything wrong here? Please help me!
Thanks!

IE can have issues with security when using IFrames.
Try setting your security mode to lowest for that site and see if it works (Making sure to set it back after testing to ensure your browser isn't left vulnerable!). If it does, change the code in the iframe to load the javascript from the same domain instead of the CDN. (or just try this first!)
It is possible that IE is preventing the content of the iframe from loading the JS from a seperate domain. You can check this using something like fiddler, see what calls the page makes after loading.

Related

Iframe does not fully load in all IE versions

I am trying to load an iframe, get an part of his content and delete the iframe.
My solution works on FF, Chrome but fails sometimes in all IE versions.
When I load an page in browser I see the its full content, but when I load exactly the same page in iframe there are missing elements from the page.
I've tried to add the iframe by hand from console and sometimes the page load all its content ,some times it doesn't.
Does anyone have a clue why does this happen?
i believe that not declaring DOCTYPE (in both the iframe source and the parent) can cause issues like that.
undeclared doctypes can cause the browser to revert to quirks mode

IFrame: Running an Iframe on Chrome but want to keep IE settings

Right now I have a webpage that renders differently on internet explorer than chrome. I want to load an iframe that holds this webpage. When the webpage is shown within the iframe I want it to render in the way it renders on Internet Explorer. Is there a way to ensure that even users who run this application on chrome/firefox will see the iframe loaded with the internet explorer configuration? I was not sure if the iframe automatically conforms to the browser the webpage is being run on or if there is a way to change the iframe to have it render the way a specific browser would?
No, the page within the iframe will be rendered by whatever browser is rendering the parent page.
Instead, you should focus your efforts on developing a website that operates correctly in all of your target browsers rather than just IE.
There is a vague chance you can do it with CSS but it's highly unlikely. What renders web pages in a certain way is the browser of the user themselves. That's what translates the HTML and that's why your code looks different, because Chrome translates it one way, and Internet Explorer a different way (by the way no one uses IE since XP).

Contents inside an iframe don't load at all or a warning shows up - iframe src is unsecured and different domain that the containing page

I have a webpage from https://creator.zoho.com that contains an iframe. The iframe scr is http://somedomain.example.com (NOTE that it is not https). The iframe content contains scripts for JQuery, SignalR etc.
I get the following behavior across OS and browsers with their default security settings:
Windows
Internet Explorer - No issues, works fine.
Chrome - Does not load the iframe context at all (I see the DOM of iframe and it is empty). A shield icon appears on the right of the address bar and on click the message is "the page includes scripts from unauthenticated sources." I have an option "Load unsafe script". I click it and everything is works.
Firefox - Does not load anything in the iframe. No security indicator nor any warnings.
Safari - No issues, works fine.
Mac OS
Chrome - Does not load the iframe context at all (I see the DOM of iframe and it is empty). A shield icon appears on the right of the address bar and on click the message is "the page includes scripts from unauthenticated sources." I have an option "Load unsafe script". I click it and everything is works.
Firefox - Does not load the iframe context at all (I see the DOM of iframe and it is empty). A shield icon appears on the left of the address bar and on click the there is a security related message. I have an option "Load unsafe script". I click it and everything is works.
Safari - Does not load the iframe context at all. No security warning. No indication that something is blocked.
Does anyone have a clue as to what is wrong?
After a good amount of Googling, I can came across - https://developer.mozilla.org/en-US/docs/HTTP/X-Frame-Options - but not very sure if this is a solution for my case for all browsers OR if it is even the right solution for any browser for the situation that I am facing.
Thanks in advance for reading my post.
My problem was resolved by moving the application (that was loading in the iframe) to HTTPS. So now the parent page and the iframe both are on HTTPS. They still on different domains, but both being HTTPS solved the issue for me.

IE9 throws exceptions when loading scripts in iframe. Why?

Precondition:
I have an aspx-page with iframe inside. This iframe points to the url handled by MVC on the same site (it's hybrid site, both standard ASP.NET and ASP.NET MVC). The resulting page rendered by MVC contains a lot of scripts references.
Problem:
IE9 throws an exception on every single script it load in iframe. These exceptions are similar to this one:
Error: 'Function' is undefined
That is, it says that the most basic things every window has is somehow absent. Once you clicked through all of these popups, the page just works as designed!
If I load a URL from <iframe /> src attribute in the browser directly, everything works as expected.
If I open the page in another browser (I tried Opera, Firefox), everything works as expected -- no errors.
So, what IE9 wants?
There is this msdn page about this bug (or feature).
You get these kinds of errors when you move the iframe element around in DOM. In such cases, IE 9 garbage collects the iframe (causing your undefined bug) and reloads it at another position.
In general, you should create the element, set its src attribute only once and then put it somewhere in the DOM tree once. It has nothing to do with the code which runs in the iframe itself.
I have encountered this same situation in the wild. Basic symptoms:
You load script code in an iframe
The script code runs early (from the head section or top of body)
IE complains about some missing native object
I found that it can often be prevented by delaying the execution of the script code until onload or DOMContentLoaded... Not much help I know but this is one of the most difficult IE scripting bugs I have ever encountered. I upped the score of your question, hope it will be found by others as well and we can get a more detailed answer.
Also see this question:
Error in Internet Explorer 9 (not earlier versions or other browsers) when including jQuery in an iframe
Placing the following script block at the very top of the iFrame html <head> seems to resolve the issue in my case. Basically, it forces the iframe to reload, which as some have pointed out, solves the issue. It seems relatively safe, because, without things like 'Object' and 'Date', javascript is essentially useless.
<script type="text/javascript">
if(typeof(Object)==="undefined"){
window.location.reload();
}
</script>
Try loading the javascript at the end after complete web page is loaded. I feel the script is executing even before the iframe is completely loaded.
for some suggestion of scripting in IE9 view the given link below
http://blogs.msdn.com/b/ie/archive/2010/06/25/enhanced-scripting-in-ie9-ecmascript-5-support-and-more.aspx
Further investigation revealed that the solution is to add the offending iframe to it's dom location BEFORE setting the 'src' attribute.
Once the 'src' has been set, changing location of the iframe within the DOM stack forces IE9 to garbage collect it.
Once 'src' has been set, iframe can be resized and changed via css positioning, but cannot change the relative location in the DOM stack.
Often times, plugins like dialogs and lightboxes will stuff an iframe with src already set into the dom, then append / prepend or whatever, triggering the GC to take place.
function waitForjQuery(){
if(typeof jQuery!='undefined'){
//Do yor stuff!
}
else{
setTimeout(function(){
waitForjQuery();
},500);
}
}
waitForjQuery();

Loading javascript in an iFrame on different subdomains

I have a javascript function that loads CKEditor in one of my iFrames. Problem is that my iFrame is located on a different subdomain. I fixed this by using document.domain, however my CKeditor only loads sometimes. Does anyone know how to solve this?
I've not tested it myself, but give this a try : iframe-xdr

Categories