Tutorial :How can I reference a popup window from two different pages?


I need to allow a user to click a link in "page-1.htm" and open a popup window. Then, when the user browses to "page-2.htm" in the main browser window I need to be able to reference the popup window.

JavaScript in "page-1.htm"

var playerWin = window.open("player.htm", "playerWin", "width=300,height=130");  playerWin.play("song.mp3");  // play() is a function in player.htm  

JavaScript in "page-2.htm"


This code in page-2.htm generates an error "playerWin is not defined". That is understandable because no variable named playerWin has been defined on page-2.htm.

My question is: Am I able to reference the popup window from page-2.htm?


I just did a quick test even after you leave the opener page, the popup still have 'opener' object and you can access it. So either poll the opener and reset the reference, or add a timer after you leave the page to wait and then relink.


<script>  var w = window.open("p.htm", "playerWin", "width=300,height=130");  </script>  <a href="2.htm">2</a>  


<a href="javascript:opener.w=this;">re-link</a>  


<script>      var w;  </script>  <a  href="javascript:alert(w);">check</a>  


The answer is no. Most browsers will completely isolate the window and document from one navigation to the next. There is no where you could place the reference to the popup which will survive when you navigate to page2.


You need to put page-1.htm in an iframe (that takes up the full browser window)... then launch and communicate with the popup via the parent window of page-1.

ie. (sorry for pseudo code)

user clicks on link in page-1  page-1 asks it's parent window to open a popup  popup opens    user navigates away (in the iframe)  user clicks a link in page-2  page-2 asks it's parent window to close it's popup  

So long as everything is all on the same domain, and navigation stays within the iframe this should work


Haven't seen that before... I'm going to assume you are doing this because you have to and don't have the option to organize your pages differently.

Since you are using ASP.NET, just have page-2 set a session value. Then have your player page run an AJAX timer to check the session variable then perform the appropriate action since it has a handle on the popup window.


The accepted answer didn't work for me in Firefox 12.0. I'm currently working on a project where the application must have persistent knowledge of which popups are open/closed while navigating from page to page or refreshing the current page. I'm using JavaScript cookies to store information on the client every time a popup opens or closes. Not perfect, but it's a good option if you don't need something that's 100% foolproof. It seems to me that trying to maintain JavaScript variables while reloading the page is always going to be much less reliable, and trying to store information about popups on the server makes no sense at all, so what else is left besides cookies?

Note:If u also have question or solution just comment us below or mail us on toontricks1994@gmail.com
Next Post »