Issue with pop up window !!!

Question

webCurious 0 Newbie Poster

14 Years Ago

Hello all!

I have 3 different links on my main page (main.asp) - X,Y,Z.
Link X opens x.asp ,
Y opens y.asp,
Z opens z.asp

When clicking on X, x.asp opens in a pop up.

When I click again on X, the focus will come to the same pop up (working as expected).

But without closing the already opened pop up, if I click on Y, the already opened window opens up, showing x.asp

I want the already opened window to refresh and show y.asp when Y is clicked. Also I don't want to open separate pop ups for X,Y and Z. Only a single pop up window should be opened when any link is clicked.

My code is as below :
**** Javascript function *************

var mywin = null;
function popUp(winObj,mypage, myname, w, h) 
{
	var winl = (screen.width - w);
	var wint = (screen.height - h);
	
	if (winObj != null)
	  {	    
	    if (!winObj.closed)
	     {
	      winObj.focus();
	      return winObj;
	     } 

	 }
	
	winprops = 'height='+(screen.height - 195)+',width='+(screen.width - 10)+',top=0,left=0,scrollbars=yes,resizable=yes,menubar=yes,toolbar=yes,location=yes,status=yes';
	win = window.open(mypage, myname, winprops);
	win.focus();
	return win;
}

*************************************
****calling the function **********

<a href="x.asp" onclick="javascript:mywin=popUp(mywin,this.href);return false" class="href_button"> X </a>

<a href="y.asp" onclick="javascript:mywin=popUp(mywin,this.href);return false" class="href_button"> Y </a>

<a href="z.asp" onclick="javascript:mywin=popUp(mywin,this.href);return false" class="href_button"> Z</a>

******************************************************

There is one more requirement :

The links X, Y and Z also exists in another page (another.asp) . If pop up from the main.asp is still open , say ,the pop up for X is still open, clicking on X in another.asp should automaticaly focus to the already opened window without refreshing the contents. In the same way if X is already open from main.asp and the link to Y is clicked from another.asp, the already opened window should be refreshed and load y.asp.

Please provide a solution which satisfies all the requirements described above to work correctly...Thanks in advance..

javascript

4 Contributors
24 Replies
219 Views
4 Days Discussion Span
Latest Post 14 Years Ago Latest Post by essential

All 24 Replies

essential 84 Posting Shark

14 Years Ago

Try this one out:

<html>
<head>
<title>PopUp</title>
<script id="script15" type="text/javascript">
<!--
var mywin = null;
var popUp = function(  mypage, winObj, myname, w, h ) {
   var win;
   myname = (( myname ) ? myname : document.title );
   w = (( w ) ? (( screen.width ) - w ) : "" );
   h = (( h ) ? (( screen.height ) - h ) : "" );
   
/*   if ( winObj !== null ) {       
      if ( !winObj.closed ) {
         winObj.focus();
         return winObj;
      } 
   } */
   
   var winprops = 'height=' + (( screen.height ) - 195 ) + ',width=' + (( screen.width ) - 10 ) + ',top=0, left=0,scrollbars=yes,resizable=yes,menubar=yes,toolbar=yes,location=yes,status=yes';
   if ( !win ) {
   win = window.open( "", myname, winprops );
   } win.focus();
   win.location.href = mypage;
   return true;
};
// -->
</script>
</head>
<body>
<div>
<a href="javascript:void(0);" onclick="popUp( 'x.asp' );" class="href_button"> Xpage </a><br><br>
<a href="javascript:void(0);" onclick="popUp( 'y.asp' );" class="href_button"> Ypage </a><br><br>
<a href="javascript:void(0);" onclick="popUp( 'z.asp' );" class="href_button"> Zpage </a>
</div> 
</body>
</html>

Airshow 416 WiFi Lounge Lizard

14 Years Ago

I've been using variants of the code below for years - first written in about 2001 I think.

One line in particular looks a bit odd - if(w.blur)w.focus(); . This was necessary for one particular browser vresion (I can't recall which)which wouldn't take focus without the preceding test - strange but true. I found the solution on some forum (pre Daniweb).

var wImg=null;
function queryWin(w){return !(w==null||w.closed||typeof w=="undefined")}
function focusWin(w){if(w.blur)w.focus()}
function show(url,width,height){
	width = (!width)? 500: width;
	height = (!height)? 500: height;
	var ff='width=' + width + ',height=' + height + ',resizable,scrollbars=no';
	if(queryWin(wImg)){wImg.location.href=url; focusWin(wImg)}
	else{wImg=window.open(url,"wImg",ff); focusWin(wImg)}
}

If I were installing it in a new project today, then I would wrap the whole thing up in a Crockford namespace pattern.

Airshow

essential 84 Posting Shark

14 Years Ago

Here's your code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<html id="html40L" lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>Free Live Help!</title>
<script language="javascript">
<!--
var win;

var popUp = function( mypage, mytitle, w, h ) {

var winprops = "";
var winW = (( top.screen.width ) ? top.screen.width : (( window.clientWidth ) ? window.clientWidth : window.innerWidth ));

var winH = (( top.screen.height ) ? top.screen.height : (( window.clientHeight ) ? window.clientHeight : window.innerHeight ));

   w = (( w ) ? (( winW ) - w ) : winW );
   h = (( h ) ? (( winH ) - h ) : winH );

winprops += "height=" + h;
winprops += ", width=" + w;
winprops += "top=0, left=0";
winprops += ", scrollbars=yes";
winprops += ", toolbar=yes";
winprops += ", resizable=yes";
winprops += ", menubar=yes";
winprops += ", location=yes";
   if ( !win ) {
   win = window.open( mypage, mytitle, winprops );
   } else if (( win ) && ( String( win.location.href ).indexOf( mypage ) !== -1 )) {
   win.focus();
   return true; 
   } else {
   win.location = mypage;
   win.focus();
   }
}; 
// -->
</script>
</head>
<body>
<div>
<ol><li>Link #1 <a href="javascript:void(0);" onclick="popUp( 'x.asp', 'X-Window', 195, 10 );">X-Page</a></li>
<li>Link #2 <a href="javascript:void(0);" onclick="popUp( 'y.asp', 'Y-Window', 195, 10 );">Y-Page</a></li>
<li>Link #3 <a href="javascript:void(0);" onclick="popUp( 'z.asp', 'Z-Window', 195, 10 );">Z-Page</a></li>
</ol>
</div>
</body>
</html>

hope it helps...

essential 84 Posting Shark

14 Years Ago

I've missed to add ( , ) on this spot : winprops += ", top=0, left=0"; make sure you'll add it up before running the script...

essential 84 Posting Shark

14 Years Ago

Actually that code is working perfectly inside OperaV8.65, and that is the only available browser in my handheld device, where i can test my programs. So firefox and all other browsers may provide different results.

But here's another workaround, for your popUp's...

Don't add any parameters inside the popUp( mypage, myname, w, h, e ); function, asside from the arguments listed on this demo.

And you'll also need provide 1 <input type="hidden" id="winstats" name="winstats" value=""> element, inside the page, where you are calling all the links (x-y-z).asp -
failure of providing this element will break the entire program!

here's the code :

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<html id="html40L" lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Window-target" content="_top">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>Free Live Help!</title>
<script type="text/javascript">
<!--
var win;
var setStatus;
var detectLocation = function( e ) { 
(( document.getElementById ) ? document.getElementById("winstats") : document.all.winstats ).value = e.data; 
};
var popUp = function( mypage, myname, w, h, e ) {
var winW = (( screen.width ) ? screen.width : (( window.clientWidth ) ? window.clientWidth : window.innerWidth ));
var winH = (( screen.Height ) ? screen.Height : (( window.clientHeight ) ? window.clientHeight : window.innerHeight ));
   w = (( w ) ? (( winW ) - w ) : winW );
   h = (( h ) ? (( winH ) - h ) : winH );
var winprops = "";
   winprops += "width=" + w;
   winprops += ", height=" + h;
   winprops += ", top=0, left=0";
   winprops += ", scrollbars=yes";
   winprops += ", menubar=yes";
   winprops += ", toolbar=yes";
   winprops += ", resizable=yes"; 
   winprops += ", location=yes"; 
var winStatus = (( document.getElementById ) ? document.getElementById("winstats") : document.all.winstats ).value;
   if ( win ) {
      if ( winStatus === mypage ) { 
      win.focus();
      return false; 
      } else {
      delete winStatus;
      win.location.href = mypage;
      setStatus.postMessage( mypage, "*" );
      win.focus();
      return; 
      }
   } else {
   win = window.open( mypage, myname, winprops );
   setStatus = (( win.opener.postMessage ) ? win.opener : (( win.opener.document.postMessage ) ? win.opener.document : undefined ));
      if (( "postMessage" in setStatus ) && ( typeof setStatus !== "undefined" )) {
      setStatus.postMessage( mypage, "*" );
      }
   } return false;
}; 
   if ( window.addEventListener ) {
   window.addEventListener( "message", detectLocation, false );
   } else if ( window.attachEvent ) {
   window.attachEvent( "onmessage", detectLocation );
   }
// -->
</script>
</head>
<body>
<div id="main">
<!-- Additionl hidden field, and you may place this anywhere inside your page -->

<input type="hidden" id="winstats" name="winstats" value="">

<a href="javascript:void(0);" onclick="popUp('x.asp', 'X-Window', 195, 10 );">X&#8212;Page</a><br>
<a href="javascript:void(0);" onclick="popUp('y.asp', 'Y-Window', 195, 10 );">Y&#8212;Page</a><br>
<a href="javascript:void(0);" onclick="popUp('z.asp', 'Z-Window', 195, 10 );">Z&#8212;Page</a>
</div>
</body>
</html>

please run this entire document, before you apply further modification on the script...

Reply to this topic

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

webCurious 0 Newbie Poster · Answer 1 · 2009-06-13T11:07:38+00:00

Hi essential,

Thank you for your quick reply . In fact I tried your code but it did'nt help me in retaining the content of an already opened window if the same link is clicked. i.e. if i click link X in main.asp, enter some details in new window , minimise it and again click on link X in main.asp, the already opened window should pop up retaining the content. Sorry, if i did'nt mention this requirement earlier.

Could you please help in modifying your code to achieve the above requirement.

Try this one out:

<html>
<head>
<title>PopUp</title>
<script id="script15" type="text/javascript">
<!--
var mywin = null;
var popUp = function(  mypage, winObj, myname, w, h ) {
   var win;
   myname = (( myname ) ? myname : document.title );
   w = (( w ) ? (( screen.width ) - w ) : "" );
   h = (( h ) ? (( screen.height ) - h ) : "" );
   
/*   if ( winObj !== null ) {       
      if ( !winObj.closed ) {
         winObj.focus();
         return winObj;
      } 
   } */
   
   var winprops = 'height=' + (( screen.height ) - 195 ) + ',width=' + (( screen.width ) - 10 ) + ',top=0, left=0,scrollbars=yes,resizable=yes,menubar=yes,toolbar=yes,location=yes,status=yes';
   if ( !win ) {
   win = window.open( "", myname, winprops );
   } win.focus();
   win.location.href = mypage;
   return true;
};
// -->
</script>
</head>
<body>
<div>
<a href="javascript:void(0);" onclick="popUp( 'x.asp' );" class="href_button"> Xpage </a><br><br>
<a href="javascript:void(0);" onclick="popUp( 'y.asp' );" class="href_button"> Ypage </a><br><br>
<a href="javascript:void(0);" onclick="popUp( 'z.asp' );" class="href_button"> Zpage </a>
</div> 
</body>
</html>

webCurious 0 Newbie Poster · Answer 2 · 2009-06-14T11:52:26+00:00

Hi essential !!

That was a good try..But it didnt help in retaining the content of the already openeed window.Clicking on the same link refreshes the already opened window thus losing all the information typed in the fields. Is this because, the window object is not passed from the function popUp when it is called. i.e should it be something like

var popUp = function(winObj, mypage, mytitle, w, h )
where winObj is passed while calling the function from link ?

I've missed to add ( , ) on this spot : winprops += ", top=0, left=0"; make sure you'll add it up before running the script...

webCurious 0 Newbie Poster · Answer 3 · 2009-06-14T20:49:58+00:00

Hi essential!

This really worked!!! There was one more requirement (and this one is the most important) in my original post which goes like this:

In the latest code you provided, if the link X is clicked, x.asp opens up. But when Y is clicked, again x.asp opens up.

Actually when x.asp is opened in a new window and when link Y is clicked, y.asp should open up in the already opened window, instead of x.asp.

In short, if x.asp is already open, clicking on link X again should retain the content of the already opened window. But when link Y is clicked, y.asp should open up in the already opened window, replacing x.asp

Sorry to pester you with more requirements!

Actually that code is working perfectly inside OperaV8.65, and that is the only available browser in my handheld device, where i can test my programs. So firefox and all other browsers may provide different results.

But here's another workaround, for your popUp's...

Don't add any parameters inside the popUp( mypage, myname, w, h, e ); function, asside from the arguments listed on this demo.

And you'll also need provide 1 <input type="hidden" id="winstats" name="winstats" value=""> element, inside the page, where you are calling all the links (x-y-z).asp -
failure of providing this element will break the entire program!

here's the code :

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<html id="html40L" lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Window-target" content="_top">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>Free Live Help!</title>
<script type="text/javascript">
<!--
var win;
var setStatus;
var detectLocation = function( e ) { 
(( document.getElementById ) ? document.getElementById("winstats") : document.all.winstats ).value = e.data; 
};
var popUp = function( mypage, myname, w, h, e ) {
var winW = (( screen.width ) ? screen.width : (( window.clientWidth ) ? window.clientWidth : window.innerWidth ));
var winH = (( screen.Height ) ? screen.Height : (( window.clientHeight ) ? window.clientHeight : window.innerHeight ));
   w = (( w ) ? (( winW ) - w ) : winW );
   h = (( h ) ? (( winH ) - h ) : winH );
var winprops = "";
   winprops += "width=" + w;
   winprops += ", height=" + h;
   winprops += ", top=0, left=0";
   winprops += ", scrollbars=yes";
   winprops += ", menubar=yes";
   winprops += ", toolbar=yes";
   winprops += ", resizable=yes"; 
   winprops += ", location=yes"; 
var winStatus = (( document.getElementById ) ? document.getElementById("winstats") : document.all.winstats ).value;
   if ( win ) {
      if ( winStatus === mypage ) { 
      win.focus();
      return false; 
      } else {
      delete winStatus;
      win.location.href = mypage;
      setStatus.postMessage( mypage, "*" );
      win.focus();
      return; 
      }
   } else {
   win = window.open( mypage, myname, winprops );
   setStatus = (( win.opener.postMessage ) ? win.opener : (( win.opener.document.postMessage ) ? win.opener.document : undefined ));
      if (( "postMessage" in setStatus ) && ( typeof setStatus !== "undefined" )) {
      setStatus.postMessage( mypage, "*" );
      }
   } return false;
}; 
   if ( window.addEventListener ) {
   window.addEventListener( "message", detectLocation, false );
   } else if ( window.attachEvent ) {
   window.attachEvent( "onmessage", detectLocation );
   }
// -->
</script>
</head>
<body>
<div id="main">
<!-- Additionl hidden field, and you may place this anywhere inside your page -->

<input type="hidden" id="winstats" name="winstats" value="">

<a href="javascript:void(0);" onclick="popUp('x.asp', 'X-Window', 195, 10 );">X—Page</a><br>
<a href="javascript:void(0);" onclick="popUp('y.asp', 'Y-Window', 195, 10 );">Y—Page</a><br>
<a href="javascript:void(0);" onclick="popUp('z.asp', 'Z-Window', 195, 10 );">Z—Page</a>
</div>
</body>
</html>

please run this entire document, before you apply further modification on the script...

essential 84 Posting Shark Featured Poster · Answer 4 · 2009-06-14T23:23:38+00:00

As i've said those were tested under opera browser, and performing the exact procedure that you are stating in your posts.

But i've never give up on the things that i've started, so here's another one for you to try on -- securing almost every block, so that it will be able to handle different types of approach passed onto opened window.

Just replace the entire <scrip>...</script> block with this moded version:

<script type="text/javascript">
<!--
var win;
var setStatus;
var detectLocation = function( e ) { 
(( document.getElementById ) ? document.getElementById("winstats") : document.all.winstats ).value = e.data; 
};
var popUp = function( mypage, myname, w, h, e ) {
var winW = (( screen.width ) ? screen.width : (( window.clientWidth ) ? window.clientWidth : window.innerWidth ));
var winH = (( screen.Height ) ? screen.Height : (( window.clientHeight ) ? window.clientHeight : window.innerHeight ));
   w = (( w ) ? (( winW ) - w ) : winW );
   h = (( h ) ? (( winH ) - h ) : winH );
var winprops = "";
   winprops += "width=" + w;
   winprops += ", height=" + h;
   winprops += ", top=0, left=0";
   winprops += ", scrollbars=yes";
   winprops += ", menubar=yes";
   winprops += ", toolbar=yes";
   winprops += ", resizable=yes"; 
   winprops += ", location=yes"; 
var winStatus = (( document.getElementById ) ? document.getElementById("winstats") : document.all.winstats ).value;

   if ( win ) {
      if ( "postMessage" in setStatus ) {
         if ( winStatus === mypage ) { 
         win.focus();
         return false; 
         } else {
         win.location = mypage;
         setStatus.postMessage( mypage, "*" );
         win.focus();
         return true; 
         }
      } else {
         if ( win.location.href.toLowerCase().indexOf( mypage ) !== -1 ) {
         win.focus();
         return false;
         } else {
         win.location = mypage;
         win.focus();
         return true;
         }
      }
   } else {
   win = window.open( mypage, myname, winprops );
   setStatus = (( win.opener.postMessage ) ? win.opener : (( win.opener.document.postMessage ) ? win.opener.document : undefined ));
      if (( "postMessage" in setStatus ) && ( typeof setStatus !== "undefined" )) {
      setStatus.postMessage( mypage, "*" );
      } else {
      alert("Your browser is outdated to handle this type of JavaScript features!\nPlease update it first before viewing back...");
      return false;
      }
   } 
}; 
   if ( window.addEventListener ) {
   window.addEventListener( "message", detectLocation, false );
   } else if ( window.attachEvent ) {
   window.attachEvent( "onmessage", detectLocation );
   }
// -->
</script>

i can't imagine that we're getting deeper and deeper with this stuff, knowing that it does a simple function playing around with our opened window.

Always here to help taking the last resort...
essential

webCurious 0 Newbie Poster · Answer 5 · 2009-06-15T09:56:01+00:00

Hi essential,

Please note that this is regarding the second last code that you gave(not the last one).Please refer to the code below.

This one is working perfectly in Firefox, satisfying the requirements. But in IE it throws error in the following line .

setStatus = (( win.opener.postMessage ) ? win.opener : (( win.opener.document.postMessage ) ? win.opener.document : undefined ));

It seems that IE is not recognising the "win.opener". Please can you suggest how this can be corrected?

Actually that code is working perfectly inside OperaV8.65, and that is the only available browser in my handheld device, where i can test my programs. So firefox and all other browsers may provide different results.

But here's another workaround, for your popUp's...

Don't add any parameters inside the popUp( mypage, myname, w, h, e ); function, asside from the arguments listed on this demo.

And you'll also need provide 1 <input type="hidden" id="winstats" name="winstats" value=""> element, inside the page, where you are calling all the links (x-y-z).asp -
failure of providing this element will break the entire program!

here's the code :

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<html id="html40L" lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Window-target" content="_top">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>Free Live Help!</title>
<script type="text/javascript">
<!--
var win;
var setStatus;
var detectLocation = function( e ) { 
(( document.getElementById ) ? document.getElementById("winstats") : document.all.winstats ).value = e.data; 
};
var popUp = function( mypage, myname, w, h, e ) {
var winW = (( screen.width ) ? screen.width : (( window.clientWidth ) ? window.clientWidth : window.innerWidth ));
var winH = (( screen.Height ) ? screen.Height : (( window.clientHeight ) ? window.clientHeight : window.innerHeight ));
   w = (( w ) ? (( winW ) - w ) : winW );
   h = (( h ) ? (( winH ) - h ) : winH );
var winprops = "";
   winprops += "width=" + w;
   winprops += ", height=" + h;
   winprops += ", top=0, left=0";
   winprops += ", scrollbars=yes";
   winprops += ", menubar=yes";
   winprops += ", toolbar=yes";
   winprops += ", resizable=yes"; 
   winprops += ", location=yes"; 
var winStatus = (( document.getElementById ) ? document.getElementById("winstats") : document.all.winstats ).value;
   if ( win ) {
      if ( winStatus === mypage ) { 
      win.focus();
      return false; 
      } else {
      delete winStatus;
      win.location.href = mypage;
      setStatus.postMessage( mypage, "*" );
      win.focus();
      return; 
      }
   } else {
   win = window.open( mypage, myname, winprops );
   setStatus = (( win.opener.postMessage ) ? win.opener : (( win.opener.document.postMessage ) ? win.opener.document : undefined ));
      if (( "postMessage" in setStatus ) && ( typeof setStatus !== "undefined" )) {
      setStatus.postMessage( mypage, "*" );
      }
   } return false;
}; 
   if ( window.addEventListener ) {
   window.addEventListener( "message", detectLocation, false );
   } else if ( window.attachEvent ) {
   window.attachEvent( "onmessage", detectLocation );
   }
// -->
</script>
</head>
<body>
<div id="main">
<!-- Additionl hidden field, and you may place this anywhere inside your page -->

<input type="hidden" id="winstats" name="winstats" value="">

<a href="javascript:void(0);" onclick="popUp('x.asp', 'X-Window', 195, 10 );">X—Page</a><br>
<a href="javascript:void(0);" onclick="popUp('y.asp', 'Y-Window', 195, 10 );">Y—Page</a><br>
<a href="javascript:void(0);" onclick="popUp('z.asp', 'Z-Window', 195, 10 );">Z—Page</a>
</div>
</body>
</html>

please run this entire document, before you apply further modification on the script...

essential 84 Posting Shark Featured Poster · Answer 6 · 2009-06-15T12:13:36+00:00

IE6- always have this stubborn compatibility issues, but this will do it:

<script type="text/javascript">
<!--
var win;
var setStatus;
var detectLocation = function( e ) { 
(( document.getElementById ) ? document.getElementById("winstats") : document.all.winstats ).value = e.data; 
};

var popUp = function( mypage, myname, w, h, e ) {

var winW = (( screen.width ) ? screen.width : (( window.clientWidth ) ? window.clientWidth : window.innerWidth ));
var winH = (( screen.Height ) ? screen.Height : (( window.clientHeight ) ? window.clientHeight : window.innerHeight ));
   w = (( w ) ? (( winW ) - w ) : winW );
   h = (( h ) ? (( winH ) - h ) : winH );
var winprops = "";
   winprops += "width=" + w;
   winprops += ", height=" + h;
   winprops += ", top=0, left=0";
   winprops += ", scrollbars=yes";
   winprops += ", menubar=yes";
   winprops += ", toolbar=yes";
   winprops += ", resizable=yes"; 
   winprops += ", location=yes"; 
var winStatus = (( document.getElementById ) ? document.getElementById("winstats") : document.all.winstats );
   if ( win ) { 
      if ( setStatus.postMessage ) {
         if ( winStatus.value === mypage ) { 
         win.focus();
         return false; 
         } else {
         win.location.href = mypage;
         setStatus.postMessage( mypage, "*" );
         win.focus();
         return false; 
         }
      } else {
         if (( winStatus === mypage ) || ( String( win.location.href ).toLowerCase().indexOf( mypage.toLowerCase()) !== -1 )) {
         win.focus();
         return false;
         } else {
         win.location.href = mypage;
         winStatus.value = mypage;
         win.focus();
         return false;
         }
      }
   } else {
   win = window.open( mypage, myname, winprops );
      if ( window.postMessage || document.postMessage ) {
         try {
         setStatus = (( win.opener.postMessage ) ? win.opener : (( win.opener.document.postMessage ) ? win.opener.document : undefined ));
         } catch( error ) {
         setStatus = (( win.parent.postMessage ) ? win.parent : (( win.parent.document.postMessage ) ? win.parent.document : undefined ));
         } if ( typeof setStatus !== "undefined" ) {
         setStatus.postMessage( mypage, "*" );
         } else {
         winStatus.value = mypage;
         }
      } 
   } 
};

if ( window.postMessage || document.postMessage ) {
   if ( window.addEventListener ) {
   window.addEventListener( "message", detectLocation, false );
   } else if ( window.attachEvent ) {
   window.attachEvent( "onmessage", detectLocation );
   }
}
// -->
</script>

essential

webCurious 0 Newbie Poster · Answer 7 · 2009-06-15T14:42:50+00:00

Hi essential,

It throws error at setStatus.postMessage . when the window is reopened. The error is :

setStatus.postMessage is null or not an object.

Does this also need be put in try {} catch() ?

IE6- always have this stubborn compatibility issues, but this will do it:

<script type="text/javascript">
<!--
var win;
var setStatus;
var detectLocation = function( e ) { 
(( document.getElementById ) ? document.getElementById("winstats") : document.all.winstats ).value = e.data; 
};

var popUp = function( mypage, myname, w, h, e ) {

var winW = (( screen.width ) ? screen.width : (( window.clientWidth ) ? window.clientWidth : window.innerWidth ));
var winH = (( screen.Height ) ? screen.Height : (( window.clientHeight ) ? window.clientHeight : window.innerHeight ));
   w = (( w ) ? (( winW ) - w ) : winW );
   h = (( h ) ? (( winH ) - h ) : winH );
var winprops = "";
   winprops += "width=" + w;
   winprops += ", height=" + h;
   winprops += ", top=0, left=0";
   winprops += ", scrollbars=yes";
   winprops += ", menubar=yes";
   winprops += ", toolbar=yes";
   winprops += ", resizable=yes"; 
   winprops += ", location=yes"; 
var winStatus = (( document.getElementById ) ? document.getElementById("winstats") : document.all.winstats );
   if ( win ) { 
      if ( setStatus.postMessage ) {
         if ( winStatus.value === mypage ) { 
         win.focus();
         return false; 
         } else {
         win.location.href = mypage;
         setStatus.postMessage( mypage, "*" );
         win.focus();
         return false; 
         }
      } else {
         if (( winStatus === mypage ) || ( String( win.location.href ).toLowerCase().indexOf( mypage.toLowerCase()) !== -1 )) {
         win.focus();
         return false;
         } else {
         win.location.href = mypage;
         winStatus.value = mypage;
         win.focus();
         return false;
         }
      }
   } else {
   win = window.open( mypage, myname, winprops );
      if ( window.postMessage || document.postMessage ) {
         try {
         setStatus = (( win.opener.postMessage ) ? win.opener : (( win.opener.document.postMessage ) ? win.opener.document : undefined ));
         } catch( error ) {
         setStatus = (( win.parent.postMessage ) ? win.parent : (( win.parent.document.postMessage ) ? win.parent.document : undefined ));
         } if ( typeof setStatus !== "undefined" ) {
         setStatus.postMessage( mypage, "*" );
         } else {
         winStatus.value = mypage;
         }
      } 
   } 
};

if ( window.postMessage || document.postMessage ) {
   if ( window.addEventListener ) {
   window.addEventListener( "message", detectLocation, false );
   } else if ( window.attachEvent ) {
   window.attachEvent( "onmessage", detectLocation );
   }
}
// -->
</script>

essential

essential 84 Posting Shark Featured Poster · Answer 8 · 2009-06-15T15:07:53+00:00

That would be better if you can add another try...catch statement on the portion that throw errors.

Or simply bring it back using this exception:

if ( "postMessage" in setStatus && ( setStatus !== null || typeof setStatus !== "undefined")) { // continue the whole>>>

webCurious 0 Newbie Poster · Answer 9 · 2009-06-15T15:43:28+00:00

Hi essential,

I replaced the line
if ( setStatus.postMessage )

with

if ( "postMessage" in setStatus && ( setStatus !== null || typeof setStatus !== "undefined"))

Still the error - "Object expected"- occurs...Is there any other solution?

essential 84 Posting Shark Featured Poster · Answer 10 · 2009-06-15T15:47:11+00:00

essential 84 Posting Shark

14 Years Ago

Ok check back on me later, i'll just fix this line!

essential 84 Posting Shark Featured Poster · Answer 11 · 2009-06-15T16:06:20+00:00

Ok here we go again, and this time it looks a bit shorter and easy to maintain.

<script type="text/javascript">
<!--
var win;
var popUp = function( mypage, myname, w, h ) {

var winW = (( screen.width ) ? screen.width : (( window.clientWidth ) ? window.clientWidth : window.innerWidth ));
var winH = (( screen.Height ) ? screen.Height : (( window.clientHeight ) ? window.clientHeight : window.innerHeight ));
   w = (( w ) ? (( winW ) - w ) : winW );
   h = (( h ) ? (( winH ) - h ) : winH );
var winprops = "";
   winprops += "width=" + w;
   winprops += ", height=" + h;
   winprops += ", top=0, left=0";
   winprops += ", scrollbars=yes";
   winprops += ", menubar=yes";
   winprops += ", toolbar=yes";
   winprops += ", resizable=yes"; 
   winprops += ", location=yes"; 
var winStatus = (( document.getElementById ) ? document.getElementById("winstats") : document.all.winstats );
   if ( win ) {
      if ( winStatus.value === mypage ) {
      win.focus();
      return false;
      } else {
      winStatus.value = mypage;
      win.location.href = mypage;
      win.focus();
      } return false;
   } win = window.open( mypage, myname, winprops );
     winStatus.value = mypage;
};

// -->
</script>

webCurious 0 Newbie Poster · Answer 12 · 2009-06-15T17:25:06+00:00

Thank you very much essential !!! This is working perfeccttt!!!

Please don't be annoyed if I mention about one more requirement...
which was described in my original post..It is as follows :

The links X, Y and Z also exists in another page (another.asp) . If pop up from the main.asp is still open , say ,the pop up for X is still open, clicking on X in another.asp should automaticaly focus to the already opened window without refreshing the contents. In the same way if X is already open from main.asp and the link to Y is clicked from another.asp, the already opened window should be refreshed and load y.asp.

I am not sure whether this is literally possible...

Since you have reached this much can you please give a try on this?

essential 84 Posting Shark Featured Poster · Answer 13 · 2009-06-15T17:40:29+00:00

Ok, i'l provide you one later, when i get home...

essential

almostbob 866 Retired: passive income ROCKS · Answer 14 · 2009-06-15T18:41:38+00:00

Just as a point of interest, a ponderablesecurity concerns mean most browsers are configured to disallow pop-upthis is, at this time, a method of creating a system that will not work
A layer within the page would be

more compatible,
easier to implement and control,
still have the external files as its source,
not blocked by pop-up blockers.

essential 84 Posting Shark Featured Poster · Answer 15 · 2009-06-16T08:10:54+00:00

Ok, here's everything...

First you must include the pops.js in both pages (main.asp and 2ndASP.asp).

Here's a sample structure of nested documents:

CODE : pops.js

var win;
var popUp = function( mypage, myname, w, h ) {
   var winW = (( screen.width ) ? screen.width : (( window.clientWidth ) ? window.clientWidth : window.innerWidth ));
   var winH = (( screen.Height ) ? screen.Height : (( window.clientHeight ) ? window.clientHeight : window.innerHeight ));
   w = (( w ) ? (( winW ) - w ) : winW );
   h = (( h ) ? (( winH ) - h ) : winH );
   var opened = "active";
   var winprops = "";
   winprops += "width=" + w;
   winprops += ", height=" + h;
   winprops += ", top=0, left=0";
   winprops += ", scrollbars=yes";
   winprops += ", menubar=yes";
   winprops += ", toolbar=yes";
   winprops += ", resizable=yes"; 
   winprops += ", location=yes";
   var my2ndASPTitle = "2nd ASP Page title"; // This is the most important variable in this program. So you must provide the exact page title for the 2nd ASP page.  
   var winStatus = (( document.getElementById ) ? document.getElementById("winstats") : document.all.winstats );   
   if ( document.title === my2ndASPTitle || window.status !== "" ) {
      if ( window.status === mypage ) {
      win = window.open( "", target = opened, myname, winprops );
      win.focus();
      return false; 
      } else {  
      win = window.open( mypage, target = opened, winprops);
      win.focus(); 
      return false; 
      } 
   } else { 
   if (( typeof win === "undefined" ) || ( typeof (( win.opener ) ? win.opener : win.parent ) === "undefined" )) { 
   win = window.open( mypage, target = opened, myname, winprops );
   win.focus();
   window.status = mypage;
   winStatus.value = mypage; 
   } if ( win ) {  
      if ( winStatus.value === mypage ) {
      win.focus()
      return false;
      } else {
      win.location.href = mypage; 
      win.focus();
         }
      }  
   } 
};

CODE: main

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<html id="html40L" lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>Main ASP</title>
<script type="text/javascript" src="./pops.js"></script>
</head>
<body>
<div id="main">
<input type="hidden" id="winstats" name="winstats" value="">
<h1>Main ASP</h1>
<input type="hidden" id="winstats" name="winstats" value="">
<a href="javascript:void(0);" onclick="popUp('x.asp', 'X-Window', 195, 10 );">X—Page</a>
<br>
<a href="javascript:void(0);" onclick="popUp('y.asp', 'Y-Window', 195, 10 );">Y—Page</a>
<br>
<a href="javascript:void(0);" onclick="popUp('z.asp', 'Z-Window', 195, 10 );">Z—Page</a>
<br><br>
<a href="secondASP.asp">Go to 2nd ASP »</a>
</div>
</body>
</html>

CODE: 2ndpage

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<html id="html40L" lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>2nd ASP Page title</title>
<script type="text/javascript" src="./pops.js"></script>
</head>
<body>
<div id="main">
<input type="hidden" id="winstats" name="winstats" value="">
<a href="javascript:void(0);" onclick="popUp('x.asp', 'X-Window', 195, 10 );">X—Page</a>
<br>
<a href="javascript:void(0);" onclick="popUp('y.asp', 'Y-Window', 195, 10 );">Y—Page</a>
<br>
<a href="javascript:void(0);" onclick="popUp('z.asp', 'Z-Window', 195, 10 );">Z—Page</a>
<br><br>
<a href="mainASP.asp">Go to Main ASP »</a>
</div>
</body>
</html>

Tested under OPERAV8+

Just make sure that all pages are tied up together or things will not work.

essential 84 Posting Shark Featured Poster · Answer 16 · 2009-06-16T11:09:35+00:00

Revision of the pops.js :

* Hidden field and document.title has been romoved on its requirements.

Just include this in both pages (1st and 2nd) and things will workout on its own.

Here's the code for the pops.js

var win;
var popUp = function( mypage, myname, w, h ) {
   var winW = (( screen.width ) ? screen.width : (( window.clientWidth ) ? window.clientWidth : window.innerWidth ));
   var winH = (( screen.Height ) ? screen.Height : (( window.clientHeight ) ? window.clientHeight : window.innerHeight ));
   w = (( w ) ? (( winW ) - w ) : winW );
   h = (( h ) ? (( winH ) - h ) : winH );
   var opened = "active";
   var winprops = "";
   winprops += "width=" + w;
   winprops += ", height=" + h;
   winprops += ", top=0, left=0";
   winprops += ", scrollbars=yes";
   winprops += ", menubar=yes";
   winprops += ", toolbar=yes";
   winprops += ", resizable=yes"; 
   winprops += ", location=yes";
   if ( window.status === mypage ) {
      if ( win ) {
      win.focus();
      return false;
      } else {
      win = window.open( "", target = opened, myname, winprops );
      win.focus();
      return false;
      }
   } else if ( window.status !== mypage ) {
      if ( win ) {
      win.location.href = mypage;
      win.focus();
      window.status = mypage;
      return false;
      } window.status = mypage; 
   win = window.open( mypage, target = opened, myname, winprops );
   win.focus();
   }   
};

webCurious 0 Newbie Poster · Answer 17 · 2009-06-16T16:43:58+00:00

Hi essential,

Before implementing the last code you had given i checked the site with the code which you had given yesterday ( you can find the code as quote at the bottom). There is one different problem i am facing in the site.

If I click link X, pop up opens with page x.asp. If I close the page (x.asp) without submitting, another page (say survey.asp) pops up which is a just a survey page.This is the existing functionality. The popping up of survey page is done by the function openPage( defined below). This function is called in body unload of x.asp ( <body onunload="openPage();"....>)

function openPage() 
{
if(window.event.clientY < 0 && window.event.clientY < -80)
{

var popupURL = <some url>;

window.open(popupURL);
}

}

After the new code (which you gave yesterday and attached as quote at the end of this post) was used, I am geting diiferent errors in IE and Firefox when I click on link X (or Y or Z) and after closing x.asp without submitting

In IE I am getting the error :

The callee(server[not server application]) is not available and disappeared;all connecions are invalid.The call did not
execute

In MOzilla the erorr is

window.event is undefined.

Could you please check what is causing this problem?

Ok here we go again, and this time it looks a bit shorter and easy to maintain.

<script type="text/javascript">
<!--
var win;
var popUp = function( mypage, myname, w, h ) {

var winW = (( screen.width ) ? screen.width : (( window.clientWidth ) ? window.clientWidth : window.innerWidth ));
var winH = (( screen.Height ) ? screen.Height : (( window.clientHeight ) ? window.clientHeight : window.innerHeight ));
   w = (( w ) ? (( winW ) - w ) : winW );
   h = (( h ) ? (( winH ) - h ) : winH );
var winprops = "";
   winprops += "width=" + w;
   winprops += ", height=" + h;
   winprops += ", top=0, left=0";
   winprops += ", scrollbars=yes";
   winprops += ", menubar=yes";
   winprops += ", toolbar=yes";
   winprops += ", resizable=yes"; 
   winprops += ", location=yes"; 
var winStatus = (( document.getElementById ) ? document.getElementById("winstats") : document.all.winstats );
   if ( win ) {
      if ( winStatus.value === mypage ) {
      win.focus();
      return false;
      } else {
      winStatus.value = mypage;
      win.location.href = mypage;
      win.focus();
      } return false;
   } win = window.open( mypage, myname, winprops );
     winStatus.value = mypage;
};

// -->
</script>

essential 84 Posting Shark Featured Poster · Answer 18 · 2009-06-16T18:19:07+00:00

Do you have other script that opens a new window, asside from the script that i've provided?

Maybe you should try my latest post and see how it works...

essential 84 Posting Shark Featured Poster · Answer 19 · 2009-06-17T08:37:15+00:00

The line is fixed and you must remove the onload event which is currently attached inside your <body onload="openPage()"> .

This wil be my last post for this issue, and if you are planning to add new functions, make sure that it does not affect the other functions available in your page...

Here's the code for the new pops.js with mouse coordinates detection function, that will automatically load new window if it detects the mouseY coordinates lower than -0.

var win;
var popUp = function( mypage, myname, w, h ) {

   var winW = (( screen.width ) ? screen.width : (( window.clientWidth ) ? window.clientWidth : window.innerWidth ));

   var winH = (( screen.Height ) ? screen.Height : (( window.clientHeight ) ? window.clientHeight : window.innerHeight ));

   w = (( w ) ? (( winW ) - w ) : winW );
   h = (( h ) ? (( winH ) - h ) : winH );
   var opened = "active";

   var winprops = "";
   winprops += "width=" + w;
   winprops += ", height=" + h;
   winprops += ", top=0, left=0";
   winprops += ", scrollbars=yes";
   winprops += ", menubar=yes";
   winprops += ", toolbar=yes";
   winprops += ", resizable=yes"; 
   winprops += ", location=yes";
   
   if ( window.status === mypage ) {
      if ( typeof win !== "undefined" ) {
         if ( typeof (( win.opener ) ? win.opener : win.parent ) !== "undefined" ) { 
         win.focus();
         return false;
         } else {
         win = window.open( mypage, target = opened, myname, winprops );
         win.focus();
         return false;
         }
      } else { 
      win = window.open( "", target = opened, myname, winprops );
      win.focus();
      return false; 
      }      
   } else if ( window.status !== mypage ) {
      if ( typeof win !== "undefined" ) {
         if ( typeof (( win.opener ) ? win.opener : win.parent ) !== "undefined" ) {
         win.location.href = mypage;
         window.status = mypage;
         win.focus();
         return false;
         } 
      }
   } win = window.open( mypage, target = opened, myname, winprops );
     window.status = mypage;
     return false;
}; 

var openPage = function( e ) {
var popUpURL = "default.asp";
   e = (( e ) ? e : window.event );
var mouseY = (( "pageY" in e ) ? e.pageY : (( "clientY" in e ) ? ((( e.clientY ) + document.body.scrollTop ) + document.documentElement.scrollTop ) : 0 )); 
   if ( mouseY < 0 || mouseY < -80 ) {
   popUp( popUpURL, "TestWindow", 195, 10 );
   } return false;
}; window.onload = openPage;

essential

Issue with pop up window !!!

Recommended Answers Collapse Answers

All 24 Replies

Recommended Answers