Refreshing Parent window after closing popup - javascript

I am creating a popup window that goes to hello.html. I want my original (parent page) to reload when i close the popup window (hello.html). I can't seem to get it to work, but I'm close. Here is the code I have so far for the main page and the hello.html page....
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function open_win()
{
window.open("hello.html","_blank","toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=no, copyhistory=yes, width=400, height=400");
}
</script>
<script language="JavaScript">
function refreshParent() {
window.opener.location.href = window.opener.location.href;
if (window.opener.hello.html)
{
window.opener.hello.html.close()
}
window.close();
}
</script>
</head>
<body>
<script type="text/javascript">
var d=new Date();
document.write(d);
</script>
<form>
<input type="button" value="Open Window" onclick="open_win()">
</form>
</body>
</html>
Here is the hello.html...
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
</script>
</head>
<body>
Hello
</body>
</html>

Subscribe to the unload event in the child window and call the parent window from the child window to notify it is closing!
Edit Added a code sample...
function popupClosing() {
alert('About to refresh');
window.location.href = window.location.href;
}
var w = window.open("hello.html","_blank","toolbar=yes, location=yes, directories=no, status=no, menubar=yes, scrollbars=yes, resizable=no, copyhistory=yes, width=400, height=400");
w.onunload = function () {
window.parent.popupClosing()
};

Do it like this, after creating the popup monitor its "closed" status property in an interval. But this is added in the parent document:
var pop = window.open("page.html", "popup",
"width=800,height=500,scrollbars=0,title='popup'");
pop.focus();
var monitor = setInterval(function() {
if (pop.closed) {
document.location.reaload()
}
}, 1000);

Try putting this javascript code in your popup window:
window.onunload = function(){
window.opener.location.reload();
};
/onunload event will trigger when you close your popup window, and window.opener.location.reload() will reload the source (parent) window./

on click event of popup close function Try...
window.opener.location.reload(true);

This piece of code works as well if a new window is popped with the window.open feature.
setTimeout(function () { window.opener.location.reload(true); window.close();}, 3000);

Put this script in the header of your popup window:
<script type='text/javascript'>
window.onunload = function(){
window.opener.location.reload();}
</script>
This will reload the parent window when you close the popup.

Related

Close Child Window with Parent Window After reload

Right now, I can close child popup on parent page close. But in child popup, I make a function to reload parent page. After reload parent page I cannot close child popup on parent page close. Because the popup information is missing. Anyone suggest a solution ?
I have try to store win.open to sessionStorage, but sessionStorage can only store String information.
Here my code:
winOpen.js
var win;
$(function() {
$(".closeBtn").click(function() {
win.close();
});
});
function winOpenCenterParseReferer(add){
var url = add;
win = window.open(
"", ""
, "width=1200, height=600, location=no, menubar=no, toolbar=no, status=no, scrollbars=yes, resizable=no");
win.location.href = url;
};
parent.html
<html>
<head>
<script type="text/javascript" src="winOpen.js"></script>
</head>
<body>
close
Open Popup
</body>
</html>
popup.html
<html>
<head>
</head>
<body>
Reload Parent
</body>
</html>

Open child window and redirect parent window

I have a JavaScript that opens a new window when a button is clicked. It works fine. But, I want to re-direct the Parent Window (i.e. the current page) once the new window is opened.
Here is my script :
<script type="text/javascript">
function OpenWindow() {
window.open('/My_Folder/file.php',
'newwindow',
config='height=670,width=1400,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,directories=no,status=no');
}
</script>
And, the button:
<input type="button" value="Submit" onclick="OpenWindow()">
So, in order to be able to re-direct the Parent Window, after the new window has popped up, I added a simple line to my JS function :
<script type="text/javascript">
function OpenWindow() {
window.open('/My_Folder/new_file.php', 'newwindow',
config='height=670,width=1400,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,directories=no, status=no');
}
setTimeout(1000, '/My_Folder/PHP/file_2.php');
</script>
Meaning, after the new window has popped up, the Parent Window should re-direct in 1 second.
But, for some reason, it's not working.
Online searches have only given me solutions for situations involving the reverse : re-direct the Parent Window after CLOSING the child-window.
I want to re-direct the Parent Window after opening a new (child) window.
UPDATE
So far, I've tried these 3 ways :
(a) <script type="text/javascript">
function OpenWindow() {
window.open ('/My_Folder/new_file.php', 'newwindow',
config='height=670, width=1400,
toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no,
directories=no, status=no');
window.top.location.href = '/My_Folder/PHP/file_2.php'
}
</script>
(b) <script type="text/javascript">
function OpenWindow() { window.open('/My_Folder/file.php','newwindow',
config='height=670,width=1400,toolbar=no,menubar=no,scrollbars=no,
resizable=no, location=no,directories=no,status=no');
settimeout( function(){document.location='/My_Folder/PHP/file_2.php'}, 1000
);
}
</script>
(c) <script>
function OpenWindow() {
window.open ('/My_Folder/new_file.php', 'newwindow', 'height=670,
width=1400, toolbar=no, menubar=no, scrollbars=no, resizable=no,
location=no, directories=no, status=no');
window.location = '/My_Folder/PHP/file_2.php';
}
</script>
Of all these, none are working.
But (b) is the best solution so far, because, at least, it opens the New (Child) Window, as it should. But, it still does not re-direct the Parent Window :(((
Try this:
<script type="text/javascript">
function OpenWindow() { window.open('/My_Folder/file.php','newwindow',
config='height=670,width=1400,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,directories=no,status=no');
settimeout( function(){document.location.href='/My_Folder/PHP/file_2.php'}, 1000 );
}
</script>
Moves the settimeout into the function and uses it properly, and tells the window to change to a new location.
My javasrcipt isnt too hot, but does this not work ?
<script type="text/javascript">
function OpenWindow() {
window.open ('/My_Folder/new_file.php', 'newwindow',
config='height=670, width=1400,
toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no,
directories=no, status=no');
window.top.location.href = '/My_Folder/PHP/file_2.php'
}
</script>

How to disable the browser parent window when child window open?

I have a scenario like when i open the child widow by clicking the button in the parent window, here i want to disable the entire parent window.
I have seen many examples in the stackoverflow and google but i had not any luck and i used the following code and it does not work for me
<script>
var childWin = window.open(url, "_blank", "enabled");
childWin.focus();
</script>
try this
<html>
<head>
<script type="text/javascript">
var popupWindow = null;
function child_open() {
popupWindow = window.open('URL', "_blank", "directories=no, status=no, menubar=no, scrollbars=yes, resizable=no,width=600, height=280,top=200,left=200");
}
function parent_disable() {
if (popupWindow && !popupWindow.closed)
popupWindow.focus();
}
</script>
</head>
<body style="width: 670px; height: 670px" onfocus="parent_disable();" onclick="parent_disable();">
Click me
</body>
</html>
Hope this helps....

How to close a popup window in javascript that was sent to the background

So I was trying to use the window.close method, but it doesn't seem to be working. Here's the code:
<script>
var popup;
function openPandora() {
popup = window.open('http://www.pandora.com', '', 'width=100, height=100, resizable=no');
popup.blur();
document.getElementById('container').focus();
}
function closeWindow() {
popup.close();
}
</script>
The HTML just calls <a> with an onClick="closeWindow();"
Any ideas on how to get that popup to close? Thanks!
Are you sure if closeWindow() is getting called.
Try this
function closeWindow() {
alert("Going to close popup");
alert(popup);
popup.close();
}
What do you see?
It seems to be working for me with your code.
Try here:
http://jsfiddle.net/zfSWX/
This is my working code ---
<!DOCTYPE html>
<html>
<head>
<title>For Alex</title>
<script>
var popup;
function openPandora() {
popup = window.open('http://www.pandora.com', '', 'width=100, height=100, resizable=no');
popup.blur();
document.getElementById('container').focus();
}
function closeWindow() {
popup.close();
}
</script>
</head>
<body>
<button id="add-friend" onClick="openPandora()">Add Friend</button>
<ul id="friends-list">
</ul>
dfd
</body>
</html>

Open popup and refresh parent page on close popup

I opened a popup window by window.open in JavaScript, I want to refresh parent page when I close this popup window.(onclose event?) how can I do that?
window.open("foo.html","windowName", "width=200,height=200,scrollbars=no");
You can access parent window using 'window.opener', so, write something like the following in the child window:
<script>
window.onunload = refreshParent;
function refreshParent() {
window.opener.location.reload();
}
</script>
The pop-up window does not have any close event that you can listen to.
On the other hand, there is a closed property that is set to true when the window gets closed.
You can set a timer to check that closed property and do it like this:
var win = window.open('foo.html', 'windowName',"width=200,height=200,scrollbars=no");
var timer = setInterval(function() {
if(win.closed) {
clearInterval(timer);
alert('closed');
}
}, 1000);
See this working Fiddle example!
on your child page, put these:
<script type="text/javascript">
function refreshAndClose() {
window.opener.location.reload(true);
window.close();
}
</script>
and
<body onbeforeunload="refreshAndClose();">
but as a good UI design, you should use a Close button because it's more user friendly. see code below.
<script type="text/javascript">
$(document).ready(function () {
$('#btn').click(function () {
window.opener.location.reload(true);
window.close();
});
});
</script>
<input type='button' id='btn' value='Close' />
I use this:
<script language='javascript'>
var t;
function doLoad() {
t = setTimeout("window.close()",1000);
}
</script>
<script type="text/javascript">
function refreshAndClose() {
window.opener.location.reload(true);
window.close();
}
</script>
<body onbeforeunload="refreshAndClose();" onLoad='doLoad()''>
when the window closes it then refreshes the parent window.
window.open will return a reference to the newly created window, provided the URL opened complies with Same Origin Policy.
This should work:
function windowClose() {
window.location.reload();
}
var foo = window.open("foo.html","windowName", "width=200,height=200,scrollbars=no");
foo.onbeforeunload= windowClose;​
In my case I opened a pop up window on click on linkbutton in parent page.
To refresh parent on closing child using
window.opener.location.reload();
in child window caused re open the child window (Might be because of View State I guess. Correct me If I m wrong).
So I decided not to reload page in parent and load the the page again assigning same url to it.
To avoid popup opening again after closing pop up window this might help,
window.onunload = function(){
window.opener.location = window.opener.location;};
If your app runs on an HTML5 enabled browser. You can use postMessage. The example given there is quite similar to yours.
Try this
self.opener.location.reload();
Open the parent of a current window and reload the location.
You can reach main page with parent command (parent is the window) after the step you can make everything...
function funcx() {
var result = confirm('bla bla bla.!');
if(result)
//parent.location.assign("http://localhost:58250/Ekocc/" + document.getElementById('hdnLink').value + "");
parent.location.assign("http://blabla.com/" + document.getElementById('hdnLink').value + "");
}
You can use the below code in the parent page.
<script>
window.onunload = refreshParent;
function refreshParent() {
window.opener.location.reload();
}
</script>
Following code will manage to refresh parent window post close :
function ManageQB_PopUp() {
$(document).ready(function () {
window.close();
});
window.onunload = function () {
var win = window.opener;
if (!win.closed) {
window.opener.location.reload();
}
};
}

Categories

Resources