Refreshing Parent window after closing popup

42,664

Solution 1

Subscribe to the unload event in the child window and call the parent window from the child window to notify it is closing!

Edit Added a code sample...

function popupClosing() {
  alert('About to refresh');
  window.location.href = window.location.href;
}

var w = window.open("hello.html","_blank","toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=no, copyhistory=yes, width=400, height=400");
w.onunload = function () {
  window.parent.popupClosing()
};

Solution 2

Do it like this, after creating the popup monitor its "closed" status property in an interval. But this is added in the parent document:

var pop = window.open("page.html", "popup",
            "width=800,height=500,scrollbars=0,title='popup'");
    pop.focus();

    var monitor = setInterval(function() {

        if (pop.closed) {
            document.location.reaload()
        }

    }, 1000);

Solution 3

Try putting this javascript code in your popup window:

window.onunload = function(){
  window.opener.location.reload();
};

/onunload event will trigger when you close your popup window, and window.opener.location.reload() will reload the source (parent) window./

Solution 4

on click event of popup close function Try...

window.opener.location.reload(true);
Share:
42,664
John Doe
Author by

John Doe

Updated on July 24, 2022

Comments

  • John Doe
    John Doe almost 2 years

    I am creating a popup window that goes to hello.html. I want my original (parent page) to reload when i close the popup window (hello.html). I can't seem to get it to work, but I'm close. Here is the code I have so far for the main page and the hello.html page....

    <!DOCTYPE html>
    <html>
    <head>
    <script type="text/javascript">
    function open_win()
    {
    window.open("hello.html","_blank","toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=no, copyhistory=yes, width=400, height=400");
    }
    </script>
    
    
    <script language="JavaScript">
    
    function refreshParent() {
      window.opener.location.href = window.opener.location.href;
    
      if (window.opener.hello.html)
    
     {
        window.opener.hello.html.close()
      }
      window.close();
    }
    </script>
    
    
    </head>
    
    <body>
    
    <script type="text/javascript">
    
    var d=new Date();
    document.write(d);
    
    </script>
    
    <form>
    <input type="button" value="Open Window" onclick="open_win()">
    </form>
    </body>
    </html>
    

    Here is the hello.html...

    <!DOCTYPE html>
    <html>
    <head>
    <script type="text/javascript">
    </script>
    </head>
    <body>
    
    Hello
    
    </body>
    </html>
    
  • Shaun
    Shaun over 7 years
    This is quite a nasty solution, but it is the only one that worked for me in Chrome 55.0.2883.87. All other methods would work fine in an onclick event which leads me to believe it is Chrome restricting this to only user initiated actions similar to resizing and moving the window.