Refresh parent window from child with multiple parent window using javascript - javascript

I have tree window (first-> second -> third). I want to reload second by closing third one. But after closing third one the first one getting refresh. I had written following script.
window.onunload = refreshParent;
self.close();
function refreshParent() {
window.opener.location.reload();
}

Apply this script in third window's html file and see if it works. Also, make sure you give an unique name for all the windows.
<script>
window.onunload = closeMeAndRefreshOpener;
function closeMeAndRefreshOpener() {
window.opener.location.reload();
self.close();
}
</script>

Related

How launch JavaScript function in every new opened tab or window of the same HTML page?

I have html page SomePage with onload event:
<body onload="someEvent()">
I attached to the SomePage js file with someEvent function:
function someEvent()
{
someFunction();
}
When I open SomePage, the someEvent function is launching in first tab. But it not launch when I open SomePage in new tab. How relaunch js function in every new opened tab or window of the same page?
Update:
When I run somePage in Visual Studio witn JavaScript debugging mode and put breakpoint in someEvent function, Debugger breaking it only in first opened tab, when I open second tab, Debugger do not break the point. Therefore, I decided, that my function not refreshed in second tab. After your answers I realized that it's not JavaScript problem and my previous example work correct only without breaking point in new opened tab. Thank you for your help.
It should work in every tab as long as long as you are loading the same page.
You can test by making an alert call in the onLoad callback function.
<body onload="someEvent()">
<script>
function someEvent()
{
alert('hi');
}
</script>
We may need more info on this. If you are just going to SomePage on a separate tab then anything that happened in the first tab should happen in the second. If that isn't what you are doing then the next tab is being opened by the first and that is where we need more info.
If I need to do something on load I usually set the following up in my javascript file and link it to my html page through a <script src="/path/to/file">
window.addEventListener("load", () => {
runFunctionAfterLoaf();
});
Try using
window.onload = function() {
someFunction();
};

check if window is open and opens a new window only for once?

i use the code below to open a new window when a user drops by my site using jquery document ready function.
<script type="text/javascript">
$(document).ready(function(){
window.open('link','title','width=460,height=500,status=no,scrollbars=yes,toolbar=0,menubar=no,resizable=yes,top=460,left=600');
return false
});
</script>
However , it keeps on popping out on every single page that have this code.
What i want to do is only pop out this window ONCE for users that do not have this window opened.
If a user have this window opened and it will no longer pop out a new one.
So how can i do this??
give the window a name
If a window with the name strWindowName already exists, then strUrl is loaded into the existing window.
just make sure your window openers use the same name so that they open in the same window if the window with that name is already open. (wooh! tongue twister!)
You can try to add a cookie to the users who have the window open. Check it on every page. And don't forget to erase it when the window is closed.
About JS cookies
This may help.
http://www.javascriptkit.com/javatutors/openclose.shtml
Use browsers' cookies. It is a way to keep some "variables" across multiple pages that you can manipulate on your domain only.
Since you're using jQuery, I'd suggest you use this plugin.
This way, the code is as simple as:
$(document).ready(function() {
if ($.cookie('opened') !== null) {
window.open([...])
$.cookie('opened', 'is')
}
})
<script type="text/javascript">
$(function () {
//get the complete queryString (url) for the popup page
var url = document.URL;
//use sessionStorage to control whether the page has been opened or not
//try get the sessionStorge name, if = nothing, open page
if (sessionStorage.getItem('visited') == null) {
//then set a sessionStorage name and value,
//it is important that this line appears BEFORE the window.open
//else you will get a loop because ==null then is always true
//at last set a sessionStorage value so it no longer ==null
//and open window - once.
sessionStorage.setItem("visited", "Ja");
window.open(url, '_blank', 'width=750, height=1010');
}
});
</script>
This popup window will open only once, no cookies stored in the client browser and the next time you open the browser, the sessionStorage is gone. (The $.cookie('opened') sample above does not work!)
Kind regards,
Ola Balstad
Add a variable to the file like a Flag
<script type="text/javascript">
var myWindowFlag = false;
$(document).ready(function(){
if(!myWindowFlag){ window.open('link','title','width=460,height=500,status=no,scrollbars=yes,toolbar=0,menubar=no,resizable=yes,top=460,left=600');
myWindowFlag= true;}
return false
});
</script>
this might help you
EDIT: we can do as #devjosh said
<script type="text/javascript">
$(document).ready(function(){
if(!getCookie(myWindowFlag)){ window.open('link','title','width=460,height=500,status=no,scrollbars=yes,toolbar=0,menubar=no,resizable=yes,top=460,left=600');
} return false
});
</script>
and in your new window reset the cookie value onload

Printing a web page using just url and without opening new window?

<html>
<head>
<script type="text/javascript">
var URL = "http://localhost:8000/foobar/";
var W = window.open(URL); **Note1**
W.window.print();
</script>
</head>
<p> Print ME...............</p>
</html>
I am using this script to print a webpage.
My views render this page and The JS take care all other things.
But I dont want to open new window for that. So, What should I use instead of window.open(URL) so no new window opens. Similarly, I don't want to open new window for print function.So, Whenever I render this page it do all stuff on the same page. No new window, No new tab. How can I achieve this. I google but nothing seems working.
You can do this using a hidden iFrame (I'm using jquery for the example):
function loadOtherPage() {
$("<iframe>") // create a new iframe element
.hide() // make it invisible
.attr("src", "/url/to/page/to/print") // point the iframe to the page you want to print
.appendTo("body"); // add iframe to the DOM to cause it to load the page
}
This will load the page you want to print. To print, you can add javascript code to the print page so that it gets printed after loading:
$(document).ready(function () {
window.print();
});
This will print the page without showing a new window. I've tested this in IE8,9 and Google Chrome, so I'm not sure if this works for Safari or Firefox, though.
There's a nice example on MDN how to do that with a hidden iframe https://developer.mozilla.org/en-US/docs/Printing#Print_an_external_page_without_opening_it
In reference to #andragon's answer. updated on top of it.
You can do this using an iFrame(Not hidden because hidden iFrame prints the blank page in latest versions of browsers. You can hide after the print is triggered)
function loadOtherPage(link) {
$("<iframe class='printpage'>") // create a new iframe element
.attr("src", link) // point the iframe to the page link you want to print
.appendTo("body");
}
This will load the page link you want to print.
On loading the print page link you can call javascript.
$(document).ready(function () {
window.print();
});
window.onafterprint = function () {
$('.printpage', window.parent.document).hide();
}
This will print the page from the same window and onafterprint Event is triggered when a page has started printing, or if the print dialog box has been closed
window.parent.document is to hide the iFrame block on the parent page.
I'm using Asp .net core with razor html as view, in this case I have used window.print() to print the page then used window.onafterprint to back to the page where used want to be redirected.
You can use ViewBag to replace the "/NewSales" URL.
NOTE: window.onafterprint will be called whenever user clicks Cancel/Submit/Print button in that pop-up.
$(document).ready(function () {
window.print();
window.onafterprint = function () {
window.location.href = "/NewSales";
}
});
function CallPrint() {
var prtContent = document.getElementById('main');
var WinPrint = window.open('', '', 'width=800,height=650,scrollbars=1,menuBar=1');
var str = prtContent.innerHTML;
WinPrint.document.write(str);
WinPrint.document.close();
WinPrint.focus();
}
Call this javascript function on Print button click."main" is the id of the div which we have to print without opening into new window.I want to notify that this will print the current page div.
Try and rever in case of any issue.
Thanks,
Gourav

Refresh parent window when the pop-up window is closed

Is there any way I can refresh the parent window when a popup window is closed without adding any javascript code to the popup window?
I have a page parent.php on which users can click "open popup" to open a popup window. This popup window shows some flash content and its not possible for me to add something like
window.onunload = function(){
window.opener.location.reload();
};
to the popup window page markup.
Is there any other method to achieve this?
Thanks
To make this work in all major browsers, you need to handle the unload event handler in the pop-up and do the reloading in the main window. In the main window, add
function popUpClosed() {
window.location.reload();
}
In the pop-up:
window.onunload = function() {
if (window.opener && !window.opener.closed) {
window.opener.popUpClosed();
}
};
So the answer to your question is generally no, if you need your code to work in all browsers, in particular IE.
I'm sure you can just add this to parent.php:
var myPop = "pop up window selector"
myPop.onunload = function(){
location.reload();
};
The problem with Tim Down's method is that it doesn't answer the original question. The requirement is that you cannot add any code to the pop-up window.
One solution that I've found, while not particularly elegant, is effective across all browsers I've tested on.
You will be simply polling the newly created window object continuously, checking if it's still open.
On parent window:
var register;
var poll;
function isOpen(){
if(register.closed){alert("Closed!"); clearInterval(poll);}
}
function create(){
register = window.open("http://www.google.com","register","width=425,height=550");
poll=setInterval("isOpen()",100); //Poll every 100 ms.
}
had similar problem to detect the closing popup in the parent window. I think the reason was
in not setting the document.domain property.
any way add to Tim Down answer the document.domain property for both window and popup like this:
<script type="text/javascript">
document.domain='<?=$_SERVER['SERVER_NAME']?>';
</script>
and instead of
window.onunload = function() {
if (window.opener && !window.opener.closed) {
window.opener.popUpClosed();
}
};
I used in the popup :
<body onunload="window.opener.popUpClosed();">

javascript-how to open window (from hyperlink) and then close it with delay of 5 sec?

I am trying to open new window from hyperlink using java script and then auto close it in five seconds. It either closes right away or doesn't close at all. Here are some samples of code I was using:
"function closeOnLoad(myLink){var newWindow=window.open(myLink);newWindow.onload=SetTimeout(newWindow.close(),5000);}" + LinkText + ""
You're better off closing the window from the parent instead of defining an onload handler within the child. Due to security restrictions, you simply may not have access to modify child window events.
function closeOnLoad(myLink)
{
var newWindow = window.open(myLink);
setTimeout(
function()
{
newWindow.close();
},
5000
);
};
}
you need to use what is called a 'closure' to wrap the timeout in. It's like the function to timeout and then close is wrapped within another function.
I won't go into detail here, but lookup javascript and closures and play around to see how they work.
Here's a link to help get you started: http://www.jibbering.com/faq/faq_notes/closures.html
The window closing code should be in the window's code:
$(document).ready(function() {
setTimeout(function() {
window.close();
},5000);
})
BUT, you will get a popup asking for the user to confirm if you try & close the popup that way.
To unload is the unload() function. Here you have an example.

Categories