How to link one frame out of a nested Iframe - javascript

I have an iframe within an iframe. So Iframe-2 is within Iframe-1.
How do I link from iframe-2 to iframe-1 without going all the way out to parent window and then clicking to reopening iframe-1?

window.parent.location.href = \"target_link";

Related

Assigning window.parent.location.href = window.location.href

My page contains two iframes. Both iframes represents a single page applications that contain routes for different views.
E.g.
parent window (contains the iframes): http://mypage.com
iframe1: http://mypage.com/#case/1
iframe2: http://mypage.com/#register/2
Each iframe contains a button that, when clicked, should display the entire iframe content in the iframe parent's window.
Now I wanted to assign the href attribute of an iframe's location object to the iframe's parent location object:
window.parent.location.href = window.location.href;
This code is executed inside the iframe obviously. But when executing it , the iframe reloads http://mypage.com. The parent window doesn't get reloaded at all.
Somehow the parent frame didn't reload by assigning a new URL to window.parent.location.
Additionally, I had to call reload() to get the page doing an actual reload.
window.parent.location.reload();

How can I close a child window?

I'd like to provide a button on my child page that would close the child page from the child page itself. To make matters worse, I didn't write the child page - it is written using frames. So far I've tried this code in the child page:
Window.opener.location= '/parent page.html';
Window.close();
And, in the body:
close
HELP!
As the link you inserted is inside an iframe, use window.top.close() instead of window.close(). window.top will refer to child window you created.
HTML for your hyperlink will be
close window
This is cheating, but by refreshing the parent window the child window gets closed. Not very elegant but it works.
<form METHOD=post><p align=right><input TYPE="button" VALUE="Close This Window"onClick="window.parent.location.reload();"></p></form>

Is there a way to check whether the html is loaded on Iframe

My problem is that I have two html files for example say 1.html and 2.html. The contents of the files are
1.html
It consists of the Iframe. The source of the Iframe is 2.html.
2.html
It is a sample html page.
My question is that I want to check whether the 2.html is loaded on an Iframe or loaded on a separate browser directly without putting it inside an Iframe. The checking has to be done from 2.html only.
Any suggestions friends.
Thanks in advance.
when loaded in iframe the window.parent points to the parent window, however when loaded in a separate window window.parent points to window itself:
var loadinInIframe = window.parent != window;
with javascript you can check using document.location if window.parent.location and window.location, if parent location is not your app location then you might be iFramed
Bind a function inside the iframe's onload event and set a loaded variable on the parent page
On the iframe
window.onload = function() {
parent.iframeLoaded = true;
}
On the parent page, just declare the variable to hold the value
var iframeLoaded = false;
Now you can check this var when you need from the parent page like
if(iframeLoaded) {
// Do something
}
if (top === self) { not in a frame } else { in a frame }
Top and self are both window objects (along with parent), so you're seeing if your window is the top window.
Credit to this.
Hope that helps.

Control Inner iframe's from parent

According to this answer:
Invoking JavaScript code in an iframe from the parent page
I have an iframe that loads a page that has a div with the id flash_container
<iframe src="http://www.remote.com/a.html" id="iframeID">
I placed this code on my parent page (the page that loads the iframe) but it doesn't seem to work:
document.getElementById('iframeID').contentWindow.targetFunction();
function targetFunction() {
var el = document.getElementById('flash_container');
el.style.zoom = 0.7;
el.style.MozTransform = 'scale(0.7)';
el.style.WebkitTransform = 'scale(0.7)';
}
What I'm trying to do is to zoom-out the inner page inside the iframe from the parent page.
It's impossible to say for certain what's wrong, but I have some ideas you might want to look into.
Make sure that the iframe is loaded. Trying to do something inside a frame that hasn't finished loading clearly won't work
Are you sure that you don't have cross-domain problems. You cannot manipulate the contents of a cross-domain iframe.
Actually you could, if both side (your page and the page in the iframe) agree on sharing information, you could use message passsing. See https://stackoverflow.com/a/7938270/1571709

Setting parent window URL from a child window?

This is what I am trying to do: Once submit a form on my main JSP/HTML page a new page with some link opens. When I click on any of the link the link should open in the parent Window. I.e the Window I started from. How do i do this?
Use window.opener.location.href in javascript
For example,
Click me!
You'll need JavaScript for this. HTML's target can't target the window's parent (opener) window.
The following will open the page in the parent window if JavaScript is enabled, and open it in a new window if it is disabled. Also, it will react gracefully if the current page does not have an opener window.
<a href="page.php"
onclick="if (typeof window.opener != 'undefined') // remove this line break
window.opener.location.href = this.href; return false;"
target="_blank">
Click
</a>
MDC Docs on window.opener
Use parent.location.href if it's on the same page in an iframe. Use opener.location.href if it's another entire tab/window.

Categories