Open popup and refresh parent page on close popup

JavascriptHtmlDom Events

Javascript Problem Overview


I opened a popup window by window.open in JavaScript, I want to refresh parent page when I close this popup window.(onclose event?) how can I do that?

window.open("foo.html","windowName", "width=200,height=200,scrollbars=no");

Javascript Solutions


Solution 1 - Javascript

You can access parent window using 'window.opener', so, write something like the following in the child window:

<script>
    window.onunload = refreshParent;
    function refreshParent() {
        window.opener.location.reload();
    }
</script>

Solution 2 - Javascript

The pop-up window does not have any close event that you can listen to.

On the other hand, there is a closed property that is set to true when the window gets closed.

You can set a timer to check that closed property and do it like this:

var win = window.open('foo.html', 'windowName',"width=200,height=200,scrollbars=no");   
var timer = setInterval(function() {   
    if(win.closed) {  
        clearInterval(timer);  
        alert('closed');  
    }  
}, 1000); 

See this working Fiddle example!

Solution 3 - Javascript

on your child page, put these:

<script type="text/javascript">
    function refreshAndClose() {
        window.opener.location.reload(true);
        window.close();
    }
</script>

and

<body onbeforeunload="refreshAndClose();">

but as a good UI design, you should use a Close button because it's more user friendly. see code below.

<script type="text/javascript">
    $(document).ready(function () {
        $('#btn').click(function () {
            window.opener.location.reload(true);
            window.close();
        });
    });
</script>

<input type='button' id='btn' value='Close' />

Solution 4 - Javascript

I use this:

<script language='javascript'>
var t;
function doLoad() {
t = setTimeout("window.close()",1000);
}

</script>
<script type="text/javascript">
function refreshAndClose() {
    window.opener.location.reload(true);
    window.close();
}
</script>
<body onbeforeunload="refreshAndClose();" onLoad='doLoad()''>

when the window closes it then refreshes the parent window.

Solution 5 - Javascript

window.open will return a reference to the newly created window, provided the URL opened complies with Same Origin Policy.

This should work:

function windowClose() {
    window.location.reload();
}

var foo = window.open("foo.html","windowName", "width=200,height=200,scrollbars=no");
foo.onbeforeunload= windowClose;​

Solution 6 - Javascript

In my case I opened a pop up window on click on linkbutton in parent page. To refresh parent on closing child using

window.opener.location.reload();

in child window caused re open the child window (Might be because of View State I guess. Correct me If I m wrong). So I decided not to reload page in parent and load the the page again assigning same url to it.

To avoid popup opening again after closing pop up window this might help,

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

Solution 7 - Javascript

If your app runs on an HTML5 enabled browser. You can use postMessage. The example given there is quite similar to yours.

Solution 8 - Javascript

Try this

		self.opener.location.reload(); 

> Open the parent of a current window and reload the location.

Solution 9 - Javascript

You can reach main page with parent command (parent is the window) after the step you can make everything...

    function funcx() {
        var result = confirm('bla bla bla.!');
        if(result)
            //parent.location.assign("http://localhost:58250/Ekocc/" + document.getElementById('hdnLink').value + "");
            parent.location.assign("http://blabla.com/" + document.getElementById('hdnLink').value + "");
    } 

Solution 10 - Javascript

You can use the below code in the parent page.

<script>
    window.onunload = refreshParent;
    function refreshParent() {
      window.opener.location.reload();
    }
</script>

Solution 11 - Javascript

Following code will manage to refresh parent window post close :

function ManageQB_PopUp() {
            $(document).ready(function () {
                window.close();
            });
            window.onunload = function () {
                var win = window.opener;
                if (!win.closed) {
                    window.opener.location.reload();
                }
            };
        }

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionArMaNView Question on Stackoverflow
Solution 1 - JavascriptMorrison ColeView Answer on Stackoverflow
Solution 2 - JavascriptZuulView Answer on Stackoverflow
Solution 3 - JavascriptRay ChengView Answer on Stackoverflow
Solution 4 - JavascriptPatrick KershnerView Answer on Stackoverflow
Solution 5 - JavascriptcranzView Answer on Stackoverflow
Solution 6 - JavascriptJitendra SawantView Answer on Stackoverflow
Solution 7 - JavascriptChris LiView Answer on Stackoverflow
Solution 8 - JavascriptnmkyuppieView Answer on Stackoverflow
Solution 9 - JavascriptHamit YILDIRIMView Answer on Stackoverflow
Solution 10 - JavascriptmuqofaView Answer on Stackoverflow
Solution 11 - JavascriptUJSView Answer on Stackoverflow