Rectangle 27 0

javascript Open popup and refresh parent page on close popup?


<body onbeforeunload="refreshAndClose();">
<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' />

@gengkev, i knew OP wanted to attach the event to window close, but i believe using a button is a better UI design. however, i included code for both. please advise.

and

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

when the popup window is closed, not when the user clicks a button to refresh the page and close the popup window

Note
Rectangle 27 0

javascript Open popup and refresh parent page on close popup?


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

I didn't know window.opener, thanks! I always put the caller window in a variable in the contentWindow of the child. :-/

If you don't control JavaScript on the child page (e.g. OAuth flow) then you will need to check popupWindow.closed using setInterval like in @Zuul's solution.

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

this is fantastic. So easy. So straight forward. I saw another answer with window.opener that was awful.

Note
Rectangle 27 0

javascript Open popup and refresh parent page on close popup?


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

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

Won't work if the user shall be able to follow links in the opened window. And I am quite sure an unload event is thrown before the target URL is first loaded, as you implicitly leave about:blank. (+1 for mentioning SOP)

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

Note
Rectangle 27 0

javascript Open popup and refresh parent page on close popup?


<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.

Note
Rectangle 27 0

javascript Open popup and refresh parent page on close popup?


Note
Rectangle 27 0

javascript Open popup and refresh parent page on close popup?


"Otherwise, you cannot communicate between across different windows." is wrong. The technique is still possible, though I'd recommend the answer from @Moses

-1 removed. If you give a small example you will even get a +1 ;-)

-1: that is just plain wrong. See @Moses answer.

@ArMaN:jsfiddle.net/8c2e4/10, use window.opener. You can use this to test your environment.

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

Note
Rectangle 27 0

javascript Open popup and refresh parent page on close popup?


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

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

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.

Note
Rectangle 27 0

javascript Open popup and refresh parent page on close popup?


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);

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

Somewhat hackish but I think using a timer will work the best across all browsers.

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

This is also the best solution if the popup has several pages before it closes, as the onunload event is triggered only after the user navigates away from the first page.

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

Note
Rectangle 27 0

javascript Open popup and refresh parent page on close popup?


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

You can use this in parrent page

Your </script> tag is not properly indented.

Note
Rectangle 27 0

javascript Open popup and refresh parent page on close popup?


<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.

Note