In this article I will explain how to refresh or reload parent page when the child popup page window is closed using JavaScript in ASP.Net
Parent Page
Below is the HTML markup of the parent page where I have placed an HTML input button which when clicked will open up the Child Page as popup window.
I am displaying the Current Date Time on the Parent Page so that when the Parent Page is refreshed we will be able to notice the page refresh.
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
body
{
font-family: Arial;
font-size: 10pt;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<h2>Parent Page</h2>
<div>
Last refreshed:
<%=DateTime.Now %>
</div>
<input type="button" value="Show Popup" onclick="ShowPopup('Child.aspx')" />
<script type="text/javascript">
var popup;
function ShowPopup(url) {
popup = window.open(url, "Popup", "toolbar=no,scrollbars=no,location=no,statusbar=no,menubar=no,resizable=0,width=100,height=100,left = 490,top = 262");
popup.focus();
}
</script>
</form>
</body>
</html>
Note: To know more about the various parameters being passed to the window.open function, please refer my article Popups
Child Page
In the HTML markup of the Child page we need to place the JavaScript function RefreshParent which is called attached to the browser onbeforeunload event. Thus when the Child page popup window is closed the parent page is refreshed.
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
</style>
</head>
<body>
<form id="form1" runat="server">
<h2>Child Page</h2>
<script type="text/javascript">
function RefreshParent() {
if (window.opener != null && !window.opener.closed) {
window.opener.location.reload();
}
}
window.onbeforeunload = RefreshParent;
</script>
</form>
</body>
</html>
![Refresh or reload Parent window when Child window is closed using JavaScript in ASP.Net]()
Demo
Downloads
