I have to refresh my parent window once I am done with the changes in the popup window, for which I use :
<BODY onunload="opener.location.reload();">
But this closes my window on any event, like save, whereas I don't want to get it close. I want to close my window only by clicking window close or by clicking close button in my jsp with "Javascript".
For closing thru "Close" button.
JS :
function closeAndRefresh(){
opener.location.reload(true);
window.close();
}
Solved the problem
JS:
var myclose = false;
function ConfirmClose()
{
if (event.clientY < 0)
{
myclose=true;
}
}
function HandleOnClose()
{
if (myclose==true)
{
opener.location.href = "<%=request.getContextPath()%>parent_jsp_path";
window.close();
}
}
HTML:
<BODY onbeforeunload="ConfirmClose();" onunload="HandleOnClose();">
Related
I have a Parent page in which, I have added a search functionality.
like below
function FunClick(StrPriCaption) {
var StrPriHTML = "";
if (StrPriCaption == 'AdvSearch') {
//document.getElementById('TxtCondition').value = "AdvSearch";
//form1.submit();
var StrPriReturnValue = "";
window.open('FrmInwardHdrAdvanceSearch.aspx', null, 'height=370,width=630,top=0,left=0,resizable=yes,scrollbars=yes');
}
}
And it works perfectly. It opens a pop up window page for me to search for.
But now what I want is, IF I close the pop up,I want to refresh the parent page.
I tried with below code in Child page, but it didn't refreshed the parent page.
function CloseWindow() {
window.close();
window.opener.location.reload();
}
How can I do this using Javascript?
Method 1
<script>
function popup() {
var win = window.open("", "Page Title", "toolbar=no, location=no");
win.document.body.innerHTML = 'Close Me';
}
</script>
Open Me
It creates a popup with a link to close the window and refresh parent.
Demo: https://jsfiddle.net/eke4f72r/
Method 2
<script>
function popup() {
var win = window.open("", "Page Title", "toolbar=no, location=no");
var win_timer = setInterval(function() {
if(win.closed) {
window.location.reload();
clearInterval(win_timer);
}
}, 100);
}
</script>
Open Me
It detects from the parent window if child is closed. If true, it reloads the page.
Demo: https://jsfiddle.net/gv6nmdn9/
EDIT When using method 1, make your parent to open the popup you want and just add this in your child:
Close Me
Detect it in parent page:
iframe=window.open("");
iframe.onclose=function(){
window.location="redirect";
};
how to show only one popup at a time?
i have created one page called parent.html. On parent page, i have two links one is register and another is login.
if i click register then register page open as child window
but
if i click login then already opened child box(register) should close and login child window should open or all previously opened child box should disappear.
my code is as below
<input type="button" value="login" onclick="ShowPopup('login.asp')" />
<script type="text/javascript">
var popup;
function ShowPopup(url) {
popup = window.open(url, "self", "toolbar=no,scrollbars=no,location=no,statusbar=no,menubar=no,resizable=0,width=100,height=100,left = 490,top = 262");
popup.focus();
}
</script>
</form>
<input type="button" value="register" onclick="ShowPopup('register.asp')" />
<script type="text/javascript">
var popup;
function ShowPopup(url) {
popup = window.open(url, "self", "toolbar=no,scrollbars=no,location=no,statusbar=no,menubar=no,resizable=0,width=100,height=100,left = 490,top = 262");
popup.focus();
}
</script>
</form>
i replaced "popup" with "self". now only one child window open at a time instead of multi and working perfect.
but when i close child window, parent page is not refreshing.
child window code as below
<form id="form1" runat="server">
<input type="button" value="Refresh Parent" onclick="RefreshParent()" />
<script type="text/javascript">
function RefreshParent() {
if (window.opener != null && !window.opener.closed) {
window.opener.location.reload();
}
}
window.onbeforeunload = RefreshParent;
</script>
</form>
please help me out
First thing , there is no need to define variable & function again .. and now coming to solution as --
<script type="text/javascript">
var popup;
function ShowPopup(url) {
if(popup)
{
popup.close();
}
popup = window.open(url, "Popup", "toolbar=no,scrollbars=no,location=no,statusbar=no,
menubar=no,resizable=0,width=100,height=100,left = 490,top = 262");
popup.focus();
}
</script>
In Your Child Page ,Head Section (To refresh parent window on close)
<script>
window.onunload = refreshParent;
function refreshParent() {
if(window.opener)
window.opener.location.reload(true);
}
</script>
By default, the reload() method reloads the page from the cache, but you can force it to reload the page from the server by passing parameter to true.
-- OR --
You can also some code in parent while you open a child window and look up for its child window if its close refresh itself..
<script type="text/javascript">
var popup;
var lookupTimer=null;
function ShowPopup(url) {
if(popup)
{
popup.close();
}
popup = window.open(url, "Popup", "toolbar=no,scrollbars=no,location=no,
statusbar=no,menubar=no,resizable=0,width=100,height=100,left = 490,top = 262");
popup.focus();
lookupTimer = setInterval(function(){ loolUpChild(); }, 1000);
}
function loolUpChild()
{
if((popup.closed))
{
window.location.reload(true);
clearInterval(lookupTimer);
}
}
</script>
create a global variable and maintain your flag if previous popup is open then close first and open new
Like
if(popup){
popup.close();
popup=false;
}
after that open new
window.open(url, "Popup", "toolbar=no,scrollbars=no,location=no,statusbar=no,menubar=no,resizable=0,width=100,height=100,left = 490,top = 262");
popup = true;
My client has a link on their website which opens a customer service chat window in a popup. They are seeing users clicking the chat link multiple times, which opens multiple chat sessions, and it is throwing off their stats. I need to disable the link when the chat window is opened, and restore it when the chat window has been closed. I can't modify/access child window.
The original link looks like this:
<a class="initChat" onclick="window.open('https://chatlinkhere.com','chatwindow','width=612,height=380,scrollbars=0'); return false;">
I figured the best thing to do would be to store the window.open() as a variable in a function:
function openChat() {
child = window.open('http://www.google.com', 'chatwindow', 'width=612,height=380,scrollbars=0,menubar=0');
}
and change the link HTML to
<a class="initChat" onclick="openChat();">
Note: Ideally, I'd like to detect the original onclick's value, and store it in a variable. Something like:
jQuery('.initChat').find().attr('onclick');
But I'm not sure how to store it and then call it later.
Next I need to run a check to see if the chat window is open or not:
timer = setInterval(checkChild, 500);
function checkChild() {
if (child.open) {
alert("opened");
jQuery(".initChat").removeAttr("onclick");
jQuery(".initChat").css("opacity", ".5");
clearInterval(timer);
}
if (child.closed) {
alert("closed");
jQuery(".initChat").attr('onclick', 'openChat(); checkChild();');
jQuery(".initChat").css("opacity", "1.0");
clearInterval(timer);
}
}
Note: the alerts are just there for testing.
And add the new function to the link
<a class="initChat" onclick="openChat(); checkChild();">
And once the chat window is closed, I need to restore the onclick attribute to the link (is there an easier way to do this?)
Fiddle demo is here -> http://jsfiddle.net/JkthJ/
When I check Chrome Console I'm getting error
Uncaught TypeError: Cannot read property 'open' of undefined
UPDATE
Whoever left me the answer in http://jsfiddle.net/JkthJ/2/ thank you very much it works! :)
i think you need is open pop up if already open then foucus on pop up or noyhing should happen
you can rewrite your function as
var winPop = false;
function OpenWindow(url){
if(winPop && !winPop.closed){ //checks to see if window is open
winPop.focus(); // or nothing
}
else{
winPop = window.open(url,"winPop");
}
}
just do it in a simple way. disable the mouse events on anchor link after child window open.
css
.disableEvents{
pointer-events: none;
}
js
var childWindow;
$('a').on('click',function(){
childWindow = window.open('_blank',"height:200","width:500");
$(this).addClass('disableEvents');
});
if (typeof childWindow.attachEvent != "undefined") {
childWindow.attachEvent("onunload", enableEvents);
} else if (typeof childWindow.addEventListener != "undefined") {
childWindow.addEventListener("unload", enableEvents, false);
}
enableEvents = function(){
$('a').removeClass('disableEvents');
};
update
your child window is plain html page. Do the changes in child window html code:
<html>
<head>
<script>
function myFunction()
{
window.opener.enableEvents(); //it calls enableEvents function
}
</script>
</head>
<body onunload="myFunction()">
<!--your content-->
</body>
</html>
This is what I got to finally work:
<a class="initChat" onclick="checkWin()"></a>
<script>
var myWindow;
function openWin() {
myWindow = window.open('https://www.google.com', 'chatwindow', 'width=612,height=380,scrollbars=0');
}
function checkWin() {
if (!myWindow) {
openWin();
} else {
if (myWindow.closed) {
openWin();
} else {
alert('Chat is already opened.');
myWindow.focus();
}
}
}
</script>
I have some dojo code as below:
<script type="text/javascript">
dojo.require("dojo.io.script");
var unload = function refreshParent(){
confirmExit();
}
dojo.addOnUnload(window, "unload");
</script>
function confirmExit()
{
var r=confirm("Are you sure you want to close the window without saving it?");
if (r==true)
{
window.returnValue=true;
window.close();
}
else
{
return false;
}
}
The scenario is: On clicking on close for a window, the dojo unload gets called which closes the window.
However, I want a dialog box which asks for confirmation about the closing and if the user hits Cancel, the closing of the window should be disposed off.
However, currently, no matter what I do, the window is getting closed.
What could be the solution to this ?
You have to return the confirmExit value
var unload = function refreshParent(e){
return confirmExit();
}
I have this code in a child window (popup):
function confirmation() {
var answer = confirm("Close?")
if (answer) {
var popup = window.open('../index.php?accao=some');
popup.document.getElementById('boxid').style.visibility="visible";
} else {
return false;
}
}
And, in the parent page I have:
<div id="boxid" style="visibility: hidden">Success</div>
What I want is to show the #boxid when I click in the popup to close. Why doesn't this code work?
UPDATE: still not working.
var popup = window.parent;
popup.document.getElementById('boxid').style.visibility="visible";
You should use window.parent to refer to the parent page.
What you are doing will open a new window.