Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

Javascript windows

Posted on 2014-03-07
27
Medium Priority
?
298 Views
Last Modified: 2014-03-08
Hi Experts,

I need working solution to open child window and when parent window is closing automatically close child window.

I tried 10 different solutions from net but nothing is working.

Example . In chrome i open tab as new window and when I click x in parent child still
remains opened.

I need solution that works in all browsers.

Please help.
0
Comment
Question by:fpoyavo
  • 15
  • 11
27 Comments
 
LVL 15

Expert Comment

by:Minh Võ Công
ID: 39914197
Do you try

var win = winodw.open(URL, title, options);
window.MyOpenWindows.push(win);
Later, in a function registered for the unload event:

function closeWindows(){
    for (i=0;i<window.MyOpenWindows.length;i++)
    {
    	window.MyOpenWindows[i].close();
    }
}

Open in new window


http://www.codelodge.net/2012/11/closing-all-child-windows-using.html
0
 
LVL 58

Expert Comment

by:Gary
ID: 39914209
You can add onunload="CloseChild();" to the BODY tag and then have a function that closes the child window based on the name you assigned to the open window
e.g.
You need to declare a global var outside any functions (which will hold the window object)
var myChildWindow

You open the window like this in your function or however you opened it.
myChildWindow= window.open("mypage.html");


And our function that we call in the body onunload.
function CloseChild() {
 if (myChildWindow!= null && !myChildWindow.closed)
 myChildWindow.close();
 }
0
 
LVL 1

Author Comment

by:fpoyavo
ID: 39915030
I've requested that this question be deleted for the following reason:

Yes. I just figured out myself.
0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 
LVL 58

Expert Comment

by:Gary
ID: 39914660
And what exactly did you figure out.
0
 
LVL 1

Author Comment

by:fpoyavo
ID: 39914727
The problem is that this code does not work in for example FireFox 27.
How I do it in that version ?
0
 
LVL 58

Expert Comment

by:Gary
ID: 39914736
What code, you said you solved it yourself.

Sample code, tested in FF, IE and Chrome

<body onunload="CloseChild()">

<script>
var myChildWindow
myChildWindow= window.open("mypage.html");

function CloseChild() {
	if (myChildWindow!= null && !myChildWindow.closed)
	myChildWindow.close();
}
</script>
</body>

Open in new window

0
 
LVL 1

Author Comment

by:fpoyavo
ID: 39914739
I tested your code and a few more from forums and none of then works in FireFox 27. Did you try it yourself .. ? I guess no. My questions was about code working in any browser.

I had the code you provided a long time ago but unfortunately it does not work in new firefox 27.
0
 
LVL 1

Author Comment

by:fpoyavo
ID: 39914740
Firefox 27 does not catch either unload and before unload ... that's what causing it.
0
 
LVL 58

Expert Comment

by:Gary
ID: 39914747
Yes it works in FF27
0
 
LVL 58

Expert Comment

by:Gary
ID: 39914757
Different version using eventlistener, again fully working.

<body>

<script>
var myChildWindow;

myChildWindow= window.open("mypage.html");

window.addEventListener("unload", CloseChild );

function CloseChild() {
	if (myChildWindow!= null && !myChildWindow.closed);
	myChildWindow.close();
}
</script>
</body>

Open in new window

0
 
LVL 1

Author Comment

by:fpoyavo
ID: 39914774
Nope. It opens as I need new window as new tab but then when I click in parent window [x] in tab the event does not trigger. Just tested.
0
 
LVL 58

Expert Comment

by:Gary
ID: 39914792
Using that exact code above?
0
 
LVL 1

Author Comment

by:fpoyavo
ID: 39914804
Neither unload nor onbeforeunload trigger :( That's odd I tried all your code and mine as well ... Have no idea why when you click [x] in tab it does not trigger it ... bug in FF27 ????
0
 
LVL 1

Author Comment

by:fpoyavo
ID: 39914814
Ace, your code is working but only in standalone page ... no within my page. So I assume something is there blocking it.
0
 
LVL 1

Author Comment

by:fpoyavo
ID: 39914815
Ace, also I do it for multiple windows ... may that is the problem. My you show how you do for multiple child windows ?
0
 
LVL 58

Expert Comment

by:Gary
ID: 39914820
Instead of
window.addEventListener("unload", CloseChild );

Try this

window.addEventListener("beforeunload", CloseChild );

if that doesn't work try this

window.onunload  = window.onbeforeunload= (function(){CloseChild()})

There's no reason why it works for me and not you.
0
 
LVL 58

Expert Comment

by:Gary
ID: 39914821
Try this - three new tabs, all close when the parent is closed.
<body>

<script>
var myChildWindow;

myChildWindow1= window.open("mypage.html");
myChildWindow2= window.open("mypage.html");
myChildWindow3= window.open("mypage.html");

window.addEventListener("beforeunload", CloseChild );

function CloseChild() {
	if (myChildWindow1!= null && !myChildWindow1.closed);
	myChildWindow1.close();
	if (myChildWindow2!= null && !myChildWindow2.closed);
	myChildWindow2.close();
	if (myChildWindow3!= null && !myChildWindow3.closed);
	myChildWindow3.close();
}
</script>
</body>

Open in new window

0
 
LVL 1

Author Comment

by:fpoyavo
ID: 39914840
Ace, I am using array like this :

 var cFFwindows = new Array();
 var win = window.open('mypage.aspx');
 childFFwindows[cFFwindows.length] = win;

Then do this :

function closeAll() {

alert('Here');
 for (i = 0; i < window.cFFwindows.length; i++) {

                if (window.cFFwindows[ i ] != null && !window.cFFwindows[ i ].closed) {
                    window.cFFwindows[ i ].close();
                }
            }
}


But it does not work ... it even shows alert ... so it its not even triggers it.
0
 
LVL 1

Author Comment

by:fpoyavo
ID: 39914843
P.S. I meant it does NOT show alert.
0
 
LVL 1

Author Comment

by:fpoyavo
ID: 39914848
Ace, I see your code is working but how do I keep multiple windows ... using array ?
0
 
LVL 1

Author Comment

by:fpoyavo
ID: 39914854
Most interesting even though I have window.addEventListener("unload", closeAll);
It does not go there ...
0
 
LVL 58

Expert Comment

by:Gary
ID: 39914864
Your code doesn't really make sense
Try this

<body>

<script>

var childFFwindows = new Array();

childFFwindows[childFFwindows.length] = window.open('mypage.aspx');

function closeAll() {
	for (i = 0; i < childFFwindows.length; i++) {
		if (childFFwindows[ i ] != null && !childFFwindows[ i ].closed) {
			childFFwindows[ i ].close();
		}
	}
}

window.addEventListener("beforeunload", closeAll );

</script>
</body>

Open in new window

0
 
LVL 1

Author Comment

by:fpoyavo
ID: 39915004
Gary,

Same thing.

window.addEventListener("beforeunload", closeAll );

but event is not triggered when I close parent tab [window] clicking on [x].

Thanks.
0
 
LVL 58

Expert Comment

by:Gary
ID: 39915009
You haven't changed the code above have you? Post what you are using now.
0
 
LVL 1

Author Comment

by:fpoyavo
ID: 39915025
Sure

var cFFwindows = new Array();

 cFFwindows[cFFwindows.length] = window.open('mypage.aspx');

 function closeAll() {

            alert('works!');
            for (i = 0; i < window.cFFwindows.length; i++) {

                if (window.cFFwindows[ i ] != null && !window.cFFwindows[ i ].closed) {
                    window.cFFwindows[ i ].close();
                }
            }

        }


window.addEventListener("beforeunload", closeAll);


and I never see even alert > works !
0
 
LVL 58

Accepted Solution

by:
Gary earned 2000 total points
ID: 39915029
Remove the alert, it won't work with that.
0
 
LVL 1

Author Closing Comment

by:fpoyavo
ID: 39915031
Great !!! wow !!! what a catch :)))
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

The article shows the basic steps of integrating an HTML theme template into an ASP.NET MVC project
Originally, this post was published on Monitis Blog, you can check it here . In business circles, we sometimes hear that today is the “age of the customer.” And so it is. Thanks to the enormous advances over the past few years in consumer techno…
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Suggested Courses

876 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question