943,699 Members | Top Members by Rank

Web Development > JavaScript / DHTML / AJAX > Parent/Child Windows
Ad:
You are currently viewing page 1 of this multi-page discussion thread
Permalink
Jul 31st, 2007
0

Parent/Child Windows

Expand Post »
I am new to DOM and need a little help. I have opened a named page with window.open. Later when the user clicks on the link from the parent page that was used to open the child window, they are confused because they think the function doesn't work. Of course, the page is already open. All I need is the code to bring the child window back to the front. I assume I will need to use focus() and have tried everything I can think of. Do I need an if statement on the function that opens the child window to determine if the child window is already open and what is the DOM code i.e. window.childWindowName.focus()? Thanks in advance for your help!
Last edited by JC4QLx3; Jul 31st, 2007 at 10:07 am.
Similar Threads
Reputation Points: 10
Solved Threads: 0
Newbie Poster
JC4QLx3 is offline Offline
13 posts
since Jul 2007
Permalink
Jul 31st, 2007
0

Re: Parent/Child Windows

When the button is clicked, check to see if the window is already open using the 'window.closed' property which returns a boolean. If the child window is open, just give it the focus using the function 'focus()' and if it isn't then open a new one.

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. <html>
  2. <head>
  3.     <script>
  4.     var wnd = null;
  5.     function openit()
  6.     {
  7.         if(!wnd || wnd.closed)
  8.             wnd = window.open("http://www.google.com");    
  9.         else
  10.             wnd.focus();
  11.     }
  12.     </script>
  13. </head>
  14. <body>
  15.     <form>
  16.         <input type="button" value="Open" onclick="openit();" />
  17.     </form>
  18. </body>
  19. </html>
Last edited by ~s.o.s~; Jul 31st, 2007 at 3:07 pm.
Super Moderator
Featured Poster
Reputation Points: 3233
Solved Threads: 719
Failure as a human
~s.o.s~ is offline Offline
8,871 posts
since Jun 2006
Permalink
Aug 1st, 2007
0

Re: Parent/Child Windows

I truly appreciate your help. I modified my script per your sample (I think), but it doesn't work. With what I have here the window doesn't open. Do you or anyone else see the problem?

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. <SCRIPT>
  2.     var name = null;
  3.     function openWindow(url,name)
  4.     {
  5.  
  6. 	if(!name || name.closed)
  7. 	{
  8. 	var windowHeight,windowWidth,windowTop,windowLeft
  9. 	windowHeight = screen.availHeight;
  10. 	windowWidth = screen.availWidth;
  11. 	windowTop = 0;
  12. 	windowLeft = 0;
  13.  
  14. 	var varStore = "";
  15. 	varStore = varStore + "width=" + windowWidth;
  16. 	varStore = varStore + ",height=" + windowHeight;
  17. 	varStore = varStore + ",resizable=" + "1";
  18. 	varStore = varStore + ",scrollbars=" + "0";
  19. 	varStore = varStore + ",menubar=" + "0";
  20. 	varStore = varStore + ",toolbar=" + "0";
  21. 	varStore = varStore + ",directories=" + "0";
  22. 	varStore = varStore + ",location=" + "0";
  23. 	varStore = varStore + ",status=" + "1";
  24. 	varStore = varStore + ",left=" + windowLeft;
  25. 	varStore = varStore + ",top=" + windowTop;
  26. 	varStore = varStore + ",ScreenX=" + windowLeft;
  27. 	varStore = varStore + ",ScreenY=" + windowTop;
  28. 	window.open(url,name,varStore)
  29. 	}
  30. 	else
  31. 	{
  32. 	name.focus();
  33.         }
  34.    }
  35. </SCRIPT>
  36.  
  37. <P align="center"><A href="javaScript:openWindow('member_panel.php?page=BO_Home','BO_Home')"><IMG src="http://qlx3.net/images/home.png" alt="Home" width="256" height="217"></A></P>
Last edited by JC4QLx3; Aug 1st, 2007 at 12:09 am.
Reputation Points: 10
Solved Threads: 0
Newbie Poster
JC4QLx3 is offline Offline
13 posts
since Jul 2007
Permalink
Aug 1st, 2007
0

Re: Parent/Child Windows

Your code does not run because you ignore the important aspects of the code posted by me. You have a global variable called 'name' and at the same time have a local variable 'name'. Because of this the local one hides the global one. Change the name of the function variable to something else than 'name'.

The second mistake you make is of not assigning the reference of the newly opened window to the variable 'name'. See my previous example for more info and post your code if it still doesn't work.
Super Moderator
Featured Poster
Reputation Points: 3233
Solved Threads: 719
Failure as a human
~s.o.s~ is offline Offline
8,871 posts
since Jun 2006
Permalink
Aug 1st, 2007
0

Re: Parent/Child Windows

I do not see the difference between what you did and what I did. Anyway, would you like to earn money for your advice. We have need for a developer with these skills. Please send your contact info to gojimgo@insightbb.com. If you do that, please send your response with read receipt, so I don't just throw it away.
Reputation Points: 10
Solved Threads: 0
Newbie Poster
JC4QLx3 is offline Offline
13 posts
since Jul 2007
Permalink
Aug 1st, 2007
0

Re: Parent/Child Windows

Do something like this:
<SCRIPT>
    var name = null;
    function openWindow(url, named)
    {
    
    if(!name || name.closed)
    {
    var windowHeight,windowWidth,windowTop,windowLeft
    windowHeight = screen.availHeight;
    windowWidth = screen.availWidth;
    windowTop = 0;
    windowLeft = 0;
        
    var varStore = "";
    varStore = varStore + "width=" + windowWidth;
    varStore = varStore + ",height=" + windowHeight;
    varStore = varStore + ",resizable=" + "1";
    varStore = varStore + ",scrollbars=" + "0";
    varStore = varStore + ",menubar=" + "0";
    varStore = varStore + ",toolbar=" + "0";
    varStore = varStore + ",directories=" + "0";
    varStore = varStore + ",location=" + "0";
    varStore = varStore + ",status=" + "1";
    varStore = varStore + ",left=" + windowLeft;
    varStore = varStore + ",top=" + windowTop;
    varStore = varStore + ",ScreenX=" + windowLeft;
    varStore = varStore + ",ScreenY=" + windowTop;
    name = window.open(url,name,varStore)
    }
    else
    {
    name.focus();
        }
   }
</SCRIPT>
<P align="center"><A href="javascript:openWindow('member_panel.php?page=BO_Home','BO_Home')"><IMG src="http://qlx3.net/images/home.png" alt="Home" width="256" height="217"></A></P>

Oh and BTW, get into the habit of using lowercase alphabets for tag names as we are now in the XHTML era.
Super Moderator
Featured Poster
Reputation Points: 3233
Solved Threads: 719
Failure as a human
~s.o.s~ is offline Offline
8,871 posts
since Jun 2006
Permalink
Aug 1st, 2007
0

Re: Parent/Child Windows

Actually, you should not use html attributes as variable names.
Reputation Points: 730
Solved Threads: 181
Nearly a Senior Poster
MidiMagic is offline Offline
3,314 posts
since Jan 2007
Permalink
Aug 1st, 2007
0

Re: Parent/Child Windows

Good point, I missed that one. But considering there are no attributes having the name 'name' in the global namespace (window), there is no harm as such. I for one, don't prefer using such names as my variable names.
Super Moderator
Featured Poster
Reputation Points: 3233
Solved Threads: 719
Failure as a human
~s.o.s~ is offline Offline
8,871 posts
since Jun 2006
Permalink
Aug 1st, 2007
0

Re: Parent/Child Windows

Thanks, you are being so helpful! We are very close. The only problem left to resolve is that the user cannot open the 3 different windows at the same time, which we want. The reason is that we need to set name to 'null' for every attempt. The following was my attempt to do that, but it creates an error. Note that I moved the var name = null; to within the function call.

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. <SCRIPT>
  2.     function openWindow(url, named)
  3.     {
  4.     var name = null;
  5. 	name = named;
  6.  
  7.     if(!name || name.closed)
  8.     {
  9.     var windowHeight,windowWidth,windowTop,windowLeft
  10.     windowHeight = screen.availHeight;
  11.     windowWidth = screen.availWidth;
  12.     windowTop = 0;
  13.     windowLeft = 0;
  14.  
  15.     var varStore = "";
  16.     varStore = varStore + "width=" + windowWidth;
  17.     varStore = varStore + ",height=" + windowHeight;
  18.     varStore = varStore + ",resizable=" + "1";
  19.     varStore = varStore + ",scrollbars=" + "0";
  20.     varStore = varStore + ",menubar=" + "0";
  21.     varStore = varStore + ",toolbar=" + "0";
  22.     varStore = varStore + ",directories=" + "0";
  23.     varStore = varStore + ",location=" + "0";
  24.     varStore = varStore + ",status=" + "1";
  25.     varStore = varStore + ",left=" + windowLeft;
  26.     varStore = varStore + ",top=" + windowTop;
  27.     varStore = varStore + ",ScreenX=" + windowLeft;
  28.     varStore = varStore + ",ScreenY=" + windowTop;
  29.     name = window.open(url,name,varStore)
  30.     }
  31.     else
  32.     {
  33.     name.focus();
  34.     }
  35.     }
  36. </SCRIPT>
Reputation Points: 10
Solved Threads: 0
Newbie Poster
JC4QLx3 is offline Offline
13 posts
since Jul 2007
Permalink
Aug 2nd, 2007
0

Re: Parent/Child Windows

Click to Expand / Collapse  Quote originally posted by ~s.o.s~ ...
Good point, I missed that one. But considering there are no attributes having the name 'name' in the global namespace (window), there is no harm as such. I for one, don't prefer using such names as my variable names.
This still isn't working. Can someone help?

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. <SCRIPT>
  2. <!--
  3. 	// create a custom window
  4.     function openWindow(url, wnd)
  5.     {
  6.     var theName = null;
  7. 	theName = wnd;
  8.  
  9.     if(!theName || theName.closed)
  10.     {
  11.     var windowHeight,windowWidth,windowTop,windowLeft
  12.     windowHeight = screen.availHeight;
  13.     windowWidth = screen.availWidth;
  14.     windowTop = 0;
  15.     windowLeft = 0;
  16.  
  17.     var varStore = "";
  18.     varStore = varStore + "width=" + windowWidth;
  19.     varStore = varStore + ",height=" + windowHeight;
  20.     varStore = varStore + ",resizable=" + "1";
  21.     varStore = varStore + ",scrollbars=" + "0";
  22.     varStore = varStore + ",menubar=" + "0";
  23.     varStore = varStore + ",toolbar=" + "0";
  24.     varStore = varStore + ",directories=" + "0";
  25.     varStore = varStore + ",location=" + "0";
  26.     varStore = varStore + ",status=" + "1";
  27.     varStore = varStore + ",left=" + windowLeft;
  28.     varStore = varStore + ",top=" + windowTop;
  29.     varStore = varStore + ",ScreenX=" + windowLeft;
  30.     varStore = varStore + ",ScreenY=" + windowTop;
  31.     theName = window.open(url,theName,varStore)
  32.     }
  33.     else
  34.     {
  35.     theName.focus();
  36.         }
  37.    }
  38. //-->
  39. </SCRIPT>
  40.  
  41.  
  42. <P align="center"><A href="javascript:openWindow('member_panel.php?page=BO_Home','BO_Home')"><IMG src="http://qlx3.net/images/home.png" alt="Home" width="256" height="217"></A></P>
Last edited by JC4QLx3; Aug 2nd, 2007 at 1:13 am.
Reputation Points: 10
Solved Threads: 0
Newbie Poster
JC4QLx3 is offline Offline
13 posts
since Jul 2007

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.
Message:
Previous Thread in JavaScript / DHTML / AJAX Forum Timeline: Javascript Function Link
Next Thread in JavaScript / DHTML / AJAX Forum Timeline: loader page





About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC