JavaScript - Closing all browser instance for a web application

Asked By bhupen shah on 02-Nov-09 01:13 AM

Hi,

We have an web application which opens up in a popup window, user can open child popup windows from this popup window. Also our application uses frames, We also used master pages for our web application. Is there any way we can close all the windows for the application on log out of user or session time out

thanks,

Bhupen

reply - Deepak Sonawane replied to bhupen shah on 02-Nov-09 01:41 AM

Hi,
How to close all open popup windows on logout action?

Many Web applications I have seen/worked before use HTML popup windows to handle editor/add new screens.  But unfortunately there are many issues (lack of modal dialog support for example) with popups and hence using them should be the last option.Â

How do you close all the popup windows when user clicks on the “logout” link in the main page? I had hoped that there would be some collection in the window object which keeps track of the popups opened from it. But unfortunately there is no such thing. You can use window.opener to find the instance of the parent window, but not the other way around. The only option is to keep track of the popup windows generated using JavaScript.

Following is the approach I have taken. It is not perfect, but so far I haven’t come across any major issues. But if your application is already built and has a lot of window.open() calls, the following approach will affect a lot of source files.

1. Encapsulate window.open() method in a custom application method such as appShowPopup(). The method signature can be same as window.open. This is an important design technique. Whenever you access an important API, it makes sense to wrap it using a application level custom API.

var gblPopupArray  = new Array();
function appShowPopup(url,name,features) {
  for(var i=0;i<gblPopupArray.length;i++) {
    try {
      if(name==gblPopupArray[i].name) {
         gblPopupArray[i]   = window.open(url,name,features);
         return;
      }
    }
  }
  gblPopupArray[gblPopupArray.length]=window.open(url,name,features);
}

2. Inside appShowPopup() keep a track of all the popup windows using a global page level JavaScript array. Ensure that every popup window is named properly using the second argument. Before adding a popup instance check whether there are any instances in the array with same name. If there is one, replace it (instead of adding a new instance to array).

3. On logout, use the popup window array to close all popups. You will need to check the existence of a window before closing. An easier way will be to put the close() code in a try catch block.

function closeAllPopups() {
   for(var i=0;i<gblPopupArray.length;i++) {
         try {
           gblPopupArray[i].close();
         }catch(ex) {}
   }
   gblPopupArray  = new Array();
}


re - Web Star replied to bhupen shah on 02-Nov-09 01:43 AM

If you maintain references to any child windows, you can use http://www.w3schools.com/HTMLDOM/met_win_close.asp in combination with http://www.w3schools.com/js/js_timing.asp.

As a note, you should probably exercise caution when closing users' windows, as it can potentially cause a bad user experience. Imagine that I've opened up my bank's website to look at the transactions for an account so that I can clear/reconcile them. But in the middle I run off to grab some lunch or something. When I come back, I find that all of my windows have been closed and I have to relogin, even though I didn't need to 'cause I was just looking at a relatively static list of data. Or even worse, if the window-closing isn't coded correctly, I might find that my browser has been closed entirely, which is definitely a bad experience.

Here is the best code to close all windows on one click - Lakshmi s replied to bhupen shah on 03-Nov-09 12:02 AM

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html 
	 PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Geldart, Laura - 100238543 - Assignment 4 (Working with Windows) - JAVA2301</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script language="Javascript" type="text/javascript">
<!--
contentArray = new Array("","page1.html","page2.html");
function updateParent(thisPage) {
opener.document.location.  href = 
contentArray[thisPage];
}
function confirm() {
var check = confirm('Close all windows?');
if (check) {
window.close();
}
else {
return false;
}
}
function closeAll() {
if (updateParent && !updateParent.closed) {
updateParent.close();
window.close();
}
else {
window.close();
}
}
-->
</script>
</head>
<body bgcolor="#ff88bb" onbeforeunload="confirm()">
<p class="pageTitle">Control Panel</p>
<p class="navText"><a href="javascript: updateParent(1)">Load Page 1</a></p>
<p class="navText"><a href="javascript: updateParent(2)">Load Page 2</a></p>
<p class="navText"><a href="javascript: closeAll()">Close Windows</a></p>
</body>
</html>