I have stucked this issue for a month. Anyone who knows the solution, please help.
I would like to close all child window if the main window is closed (click 'X' button on tab or browser window) without any popup dialog. However, if the child window is closed by itself, there will be popup dialog asking about leaving page. So, I use localStorage to manage this scenario. (please take a look in the code below)
The problem is that any browser i.e. Internet Exlorer, Chrome works fine but Microsoft Edge (version 44) seems like that it doesn't set localStorage correctly. On MS Edge, it keeps displaying the dialog. I guess that this is an issue on MS Edge browser when set localStorage at unload event.
Anyone got the same issue? Thanks in advance for your suggestion and help.
Note: Before click "X" button at main window, please make sure that child window is dirty.
unload.html
<html>
<body>
<p>Login and Open child window:</p>
<button onclick="openWindow()">Login</button>
<p>Make child window dirty before close: </p>
<input type="text" />
<script>
var mywin;
localStorage.setItem("isOnline", "true");
function setIsonlineFalse() {
localStorage.setItem("isOnline", "false");
}
function getIsonline() {
document.getElementById("isonline").innerHTML = localStorage.getItem("isOnline");;
}
function openWindow() {
mywin = window.open('unload.html', 'child', 'fullscreen=no, left=10,top=10,width=700,height=700');
}
function closeWindow()
{
if (mywin != null)
{mywin.close();
}
return false;
}
window.addEventListener('beforeunload', function (e) {
console.log('isonline at before', localStorage.getItem("isOnline"));
if (localStorage.getItem("isOnline") == "true"){
e.preventDefault();
e.returnValue = '';
return "Leaving this page will reset the wizard";
}
});
window.addEventListener('unload', function (e) {
localStorage.setItem("isOnline", "false");
console.log('isonline at unload', localStorage.getItem("isOnline"));
closeWindow();
});
</script>
</body>
</html>