loyalflow
loyalflow

Reputation: 14919

Reload a specific frame from a popup window

I have a popup window, and from there, I want the parent window to reload, but a specific frame not the entire page.

So a user clicks a button from within a frame, it opens the popup. Now from the popup, based on a specific event, I want to reload a frame from the parent window.

Is this possible in IE?

I have a page index.php that has 2 iframes in it.

From the 2nd iframe a new popup window opens.

When the user clicks on a button or closes the popup window, I want to reload iframe#2 (the one that opened the window).

How can I do this?

I have tried:

 opener.location.reload();
 opener.top.document.getElementById('myIFrameId').location.reload()
 opener.myIFrameId.location.reload();

Nothing seems to work.

Upvotes: 3

Views: 6797

Answers (5)

Jeffery To
Jeffery To

Reputation: 11936

In your case, window.opener is the window object of the iframe that opened the popup, so opener.location.reload() should work: Demo

Demo sources:

Upvotes: 2

Kotzilla
Kotzilla

Reputation: 1423

it will show error "Error: Permission denied to access property 'reload'"

that's possibly "the same origin policy" problem.

or you create a div wrapper over the iframe and re generate iframe again

Upvotes: 0

Kernel James
Kernel James

Reputation: 4074

Have you tried:

opener.frames["myIFrameId"].location.reload();

Upvotes: 0

saschoar
saschoar

Reputation: 8230

I kind of rebuilt this functionality here: http://jsfiddle.net/JBWTn/3/

Clicking the button in the popup will change the border look of a frame in the original window . The key here is navigating through the original window's frames using

window.opener.document.getElementById('[ID_OF_YOUR_FRAME]')

(quite similar to what Frank van Puffelen suggested)

To reload the frame instead of just changing its style, use

window.opener.document.getElementById('[ID_OF_YOUR_FRAME]').location.reload()

...like you tried in your question already.

This question reminded me of the functionality in phpMyAdmin (where you can run SQL queries from a popup window and have the results shown in the main window), so I had a quick look ;)

Upvotes: 0

arttronics
arttronics

Reputation: 9955

I found a great jQuery plugin that works in all modern browsers, including IE8.

It allows you to easily call up a secondary browser window with parameters and then your allowed to pass data between the two, similar to how postMessage API works.

These data messages in turn can load new content or alternate webpage into the original iframe2 that's on your parent page once you analyze the incoming jQuery data.

Article: jQuery plugin for communication between browser windows

Online Demo: Parent Page

Download Project: windowmsg.zip

The downloaded files will work directly from your desktop, unlike jsFiddle since it's not permitted there.


Yet another solution that works great when you don't need a secondary browser window and the use of a floating iframe is acceptable, just use a lightbox clone that's iframe capable, such as Shadowbox-js.

The benefit of this method is that your in complete control of how the iframe closes, unlike the above secondary browser window that has it's own browser close button which may not trigger your desired events.

The callback during the lightbox clone closure event can take care of changing the contents in the parent pages iframe 2 as needed. Also, you can choose to have the lightbox bound within the iframe 2 (lightbox clone installed in iframe page), or have it fullscreen (lightbox clone installed in parent page).

Upvotes: 2

Related Questions