JavaScript - Confirm Window Close Only
I've been trying to write a script that activates a confirm box when a browser window is closed. I want this to occur only when they try to close the window, not if they click on links on the page to navigate elsewhere.
The confirm box then gives the option to continue closing as they intended or, if they click on ok (or cancel if it's easier), navigate to another page I specify. The script below works but it displays a confirm box when you close the window and click on links. Code: <script type="text/javascript"> function show_confirm() { var r=confirm("Wait! Would you like check out yahoo?"); if (r==true) { window.open("http://www.yahoo.com"); } else { window.close(); } } window.onbeforeunload = show_confirm; </script> I understand you may be able to create a variable that you then attach to any links on the page you don't want to activate the confirm box. I don't know how to do this. Thank you. Similar Tutorialshi all, ok, i have been asked to alter our project management system (one i wrote) to alert users to the fact that they are closing windows with unsaved work in - some of them forget they have edited a page and just close the window. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <script type="text/javascript"> var docChanged = false; function docChange(){ docChanged = true; } function checkForChanges() { if(docChanged == true) { return "All changes made to this page will be lost!"; } } window.onbeforeunload = checkForChanges; </script> </head> <body> <form id="form1" name="form1" method="post" action=""> <label> <input type="text" name="one" id="one" onchange="docChange()" /> </label> <label> <input type="text" name="two" id="two" onchange="docChange()" /> </label> <br /> <a href='http://www.google.com'>Google</a> </form> </body> </html> the above will prompt the user if they want to save if fields etc have been changed. is there a way i can dynimcally add the onchange="docChange()" to all fields on a page? the system has hundreds of fields and doing a mass search and replace might be very dangerous lol. im pretty sure it can be done but wouldnt know where to start. ive never really had enough time to learn all the window.addEventListener stuff. Hi, i have an popup which is an aspx page and when i click on browser close button..., the system should check if there is any unsaved data in the form or not. If there is any unsaved data then the message should be displayed (Do you want to leave..?) with OK and Cancel button... On click of the OK button, the data should not be saved and the user should be returned parent form ie popup should be closed and return to the parent form.On click of the cancel button, the control should return to the Pop. I had tried the below code... window.onbeforeunload = close; function close() { var result=confirm("Do you really want to close this window"); if (result) { return true; } else { location.href = document.URL; } } The above code is not working ie the popup is getting closed even on click of closse button.... and when clicked on OK it is dispalying another msgbox with leave this page and Stay on this page buttons... Please help me regarding the same... Hi! I'm new to this, so please bare with me. My terminology may not be up to par. Here's the deal: - I have a button on my Flash site that opens an HTML page in a popup window. In Flash, I open the new window using Actiosnscript 2.0: Code: on (release) { getURL("example1.html", "_blank"); } - Within the popup window are links to other HTML pages. They all open in the same window. I've been using the following to create the links in Dreamweaver: Code: onClick="MM_goToURL('parent','example2.html')" - On each page, I have a "Return to Main Menu" button that should close the popup window. To do this, I have been using: Code: onClick="window.close()" - The problem is that it works differently in each browser, and I can't even get it to consistently close the window in most browsers: Internet Explorer = popup message appears, asking "Are you sure you want to close this window?" or something similar; window closes after clicking "Yes." Safari = Only closes if I'm on the original HTML page. If I click on any of the other links (note that these all open in the same window), those pages' "Return to Main Menu" buttons cease to work. However, if I keep clicking "Back" until I get to the original page, it closes. Opera = Button actually works for each page. Firefox & Chrome = Does not close the window at all. I looked into it and saw that others have used a window.opener to solve similar issues. But, since my popup window is opened using Flash/AS2, I need to find a way around it. I've tried preceding "window.close()" with "window.opener=null" (i.e. - onClick="window.opener=null; window.close()"), but I don't think I'm doing it right because it still doesn't work. I've also seen others use codes that involve functions and variables, but it is beyond my current coding knowledge to implement this. Like I said, I'm sort of new at this. Any advice would be greatly appreciated. Thank you. - PW how can you do onclick="return getconfirm('do you want to logout?');" onClick="window.location('logout.asp');" on the same button , if confirm then go url else stay here ? thank you I am using a window.open to trigger a mailto: command. I don't want the window to stay open so I try to close it right after. The default email client launches correctly, but the window stays open and I get the following Javascript error: Unable to get value of the property 'close': object is null or undefined Code: Code: var win = window.open(mailto_link,'emailWindow'); win.close(); Hi, I have parent page with 10 child window and i want to close all child window when click on close session button on parent but first i need to check whether any child window open or not after that action should be done for close the child window. i dont want to show the confirm message when using window.onbeforeunload. Please suggest a solution to hide the confirm message.. I am having some difficulty in constructing a window.confirm() function that works with my code. So if the form data is valid, I need to use a window.confirm() dialog box to show the user's total cost based on the rental rate of equipment chosen and the reservation period. The user must accept the cost by pressing the confirm button, and if user cancels do not submit data. I have written this code but cannot figure out how to find the number of days from the 2 date fields and use that to calculate and display the total cost. Any help with this will be greatly appreciate. Thanks so much. [This is the part I am having trouble with:] //confirm submit and display rental cost Code: var equip = document.forms[0].equipment.value var pDate = document.forms[0].pickupDate.value var pHours = document.forms[0].pickupHours.value var pMinutes = document.forms[0].pickupMinutes.value var rDate = document.forms[0].returnDate.value var rHours = document.forms[0].returnHours.value var rMinutes = document.forms[0].returnMinutes.value var pTime = pHours + pMinutes var rTime = rHours + rMinutes var total = (((rDate - pDate) - 1) * 24) * equip) + ((rTime + (24 - pTime)) * equip) function confirmSubmit() { var submitForm = window.confirm("'The total rental cost is: ' + total"); if (submitForm == true) return true; return false; } [Below is the code I have so far:] Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <!-- Brooks Rogalski December 6, 2010 --> <title>ABC Outdoor Sports</title> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <script type = "text/javascript"> /* <![CDATA[ */ //image slideshow function var interval = 4000; // delay between rotating images var random_display = 1; // 0 = no, 1 = yes var pause = false; var image_index = 0; image_list = new Array(); image_list[image_index++] = new imageItem("fishing.jpg"); image_list[image_index++] = new imageItem("biking.jpg"); image_list[image_index++] = new imageItem("climbing.jpg"); image_list[image_index++] = new imageItem("kayaking.jpg"); image_list[image_index++] = new imageItem("scuba.jpg"); var number_of_image = image_list.length; function imageItem(image_location) { this.image_item = new Image(); this.image_item.src = image_location; } function get_ImageItemLocation(imageObj) { return(imageObj.image_item.src) } function generate(x, y) { var range = y - x + 1; return Math.floor(Math.random() * range) + x; } function getNextImage() { if (pause == true) return; if (random_display) { image_index = generate(0, number_of_image-1); } else { image_index = (image_index+1) % number_of_image; } var new_image = get_ImageItemLocation(image_list[image_index]); return(new_image); } function rotateImage(place) { var new_image = getNextImage(); document[place].src = new_image; var recur_call = "rotateImage('"+place+"')"; setTimeout(recur_call, interval); } //validate form functions function validateForm() { var valid = true; //validate equipment if (document.forms[0].equipment.selectedIndex == 0) { window.alert("Please select your equipment type."); document.forms[0].equipment.focus(); return false; } //validate pick-up date if (document.forms[0].pickupDate.value == "'' || '(mm/dd/yyyy)'" ) { window.alert("Please enter your Pick-up Date."); document.forms[0].pickupDate.focus(); valid = false; return valid; } today = new Date(); year = today.getFullYear() ; month = today.getMonth(); day = today.getDate(); //validate pickup date format var re =/^\d{1,2}(\-|\/|\.)\d{1,2}\1\d{2,4}$/ if(document.forms[0].pickupDate.value != '' && !document.forms[0].pickupDate.value.match(re)) { window.alert("Invalid date format: " + document.forms[0].pickupDate.value); document.forms[0].pickupDate.focus(); valid=false; return valid; } var date; var input2=document.forms[0].pickupDate.value; var cyear = parseInt(input2.substring(6,10)); var cmonth = parseInt(input2.substring(0,2)) - 1; var cday = parseInt(input2.substring(3,5)); if ( month < cmonth ){ date = year - cyear - 1; } else if ( month < cmonth ){ date = cyear - year; } else if ( month == cmonth ){ if ( cday < day ){ date = cyear - year - 1; } else if ( day > cday ){ date= cyear - year; } else if ( day == cday ){ date = cyear - year-1; } } if(date < 2){ window.alert('Must be atleast 2 days from today'); valid=false; return valid; } //validate pick-up time hours if (document.forms[0].pickupHours.selectedIndex == 0) { window.alert("Please select the number of hours for pick-up time."); document.forms[0].pickupHours.focus(); return false; } //validate pick-up time minutes if (document.forms[0].pickupMinutes.selectedIndex == 0) { window.alert("Please select the number of minutes for pick-up time."); document.forms[0].pickupMinutes.focus(); return false; } //validate return date if (document.forms[0].returnDate.value == "'' || '(mm/dd/yyyy)'" ) { window.alert("Please enter your Return Date."); document.forms[0].returnDate.focus(); valid = false; return valid; } //validate return date format if(document.forms[0].returnDate.value != '' && !document.forms[0].returnDate.value.match(re)) { window.alert("Invalid date format: " + document.forms[0].returnDate.value); document.forms[0].returnDate.focus(); valid=false; return valid; } if(document.forms[0].returnDate.value <= document.forms[0].pickupDate.value){ window.alert("Please choose later date"); valid=false; return false; } //validate return time hours if (document.forms[0].returnHours.selectedIndex == 0) { window.alert("Please select the number of hours for return time."); document.forms[0].returnHours.focus(); return false; } //validate return time minutes if (document.forms[0].returnMinutes.selectedIndex == 0) { window.alert("Please select the number of minutes for return time."); document.forms[0].returnMinutes.focus(); return false; } //validate first name if (document.forms[0].firstName.value=="") { window.alert("Please enter your first name."); document.forms[0].firstName.focus(); valid = false; return valid; } //validate last name if (document.forms[0].lastName.value=="") { window.alert("Please enter your last name."); document.forms[0].lastName.focus(); valid = false; return valid; } //validate street address if (document.forms[0].street.value=="") { window.alert("Please enter your street address."); document.forms[0].street.focus(); valid = false; return valid; } //validate city if (document.forms[0].city.value=="") { window.alert("Please enter your city."); document.forms[0].city.focus(); valid = false; return valid; } //validate zip code if (document.forms[0].zip.value==""){ window.alert("Please enter your zip code."); document.forms[0].zip.focus(); valid=false; return valid; } var re5digit=/^\d{5}$/ if (document.forms[0].zip.value.search(re5digit)==-1){ window.alert("Please enter a 5 digit number") valid=false; return valid; } //validate date of birth if (document.forms[0].date.value == "'' || '(mm/dd/yyyy)'" ){ window.alert("Please enter your date of birth."); document.forms[0].birthDate.focus(); valid=false; return valid; } var reDateFormat = /^\d{1,2}(\-|\/|\.)\d{1,2}\1\d{4}$/ if(document.forms[0].date.value.search(reDateFormat)==-1){ window.alert("Please enter a standard format. [mm/dd/yyyy]") valid=false; return valid; } //check if over 18 var age; var input = document.forms[0].birthDate.value; var pyear = parseInt(input.substring(6,10)); var pmonth = parseInt(input.substring(0,2)) - 1; var pday = parseInt(input.substring(3,5)); if ( month < pmonth ){ age = year - pyear - 1; } else if ( month > pmonth ){ age = year - pyear; } else if ( month == pmonth ){ if ( day < pday ){ age = year - pyear - 1; } else if ( day > pday ){ age = year - pyear; } else if ( day == pday ){ age = year - pyear; } } if(age < 18){ window.alert('Attention: Under 18!'); valid=false; return valid; } //confirm submit and display rental cost var equip = document.forms[0].equipment.value var pDate = document.forms[0].pickupDate.value var pHours = document.forms[0].pickupHours.value var pMinutes = document.forms[0].pickupMinutes.value var rDate = document.forms[0].returnDate.value var rHours = document.forms[0].returnHours.value var rMinutes = document.forms[0].returnMinutes.value var pTime = pHours + pMinutes var rTime = rHours + rMinutes var total = (((rDate - pDate) - 1) * 24) * equip) + ((rTime + (24 - pTime)) * equip) function confirmSubmit() { var submitForm = window.confirm("'The total rental cost is: ' + total"); if (submitForm == true) return true; return false; } } /* ]]> */ </script> </head> <body onload = "rotateImage('rImage')"> <h1> ABC Outdoor Sports Equipment </h1> <img src="fishing.jpg" id="rImage" width="250" height="200" onmouseover = "pause=true;" onmouseout = "pause=false;"> <br/> <br/> <form onsubmit = "return validateForm();" action = "mailto:rogalskibf@gmail.com?subject=ABC Customer Reservation" method="post" enctype="text/plain"> <table border = "0"> <tr> <td> Equipment:<br/> <select name = "equipment"> <option value="unselected">Select Equipment Type</option> <option value = 20>Fishing Boat</option> <option value = 15>Kayak</option> <option value = 2>Mountain Bike</option> <option value = 10>Scuba Gear</option> </select> </td> </tr> <tr> <td> Pick-up Date: <br/> <input type = "text" name = "pickupDate" value = "(mm/dd/yyyy)"/> </td> <td> Pick-up Time: <br/> <select name = "pickupHours"> <option value="unselected">hr</option> <option value = 7>07</option> <option value = 8>08</option> <option value = 9>09</option> <option value = 10>10</option> <option value = 11>11</option> <option value = 12>12</option> <option value = 13>13</option> <option value = 14>14</option> <option value = 15>15</option> <option value = 16>16</option> <option value = 17>17</option> </select> <select name = "pickupMinutes"> <option value="unselected">min</option> <option value = 0>00</option> <option value = .5>30</option> </select> </td> </tr> <tr> <td> Return Date: <br/> <input type = "text" name = "returnDate" value = "(mm/dd/yyyy)"/> </td> <td> Return Time: <br/> <select name = "returnHours"> <option value="unselected">hr</option> <option value = 7>07</option> <option value = 8>08</option> <option value = 9>09</option> <option value = 10>10</option> <option value = 11>11</option> <option value = 12>12</option> <option value = 13>13</option> <option value = 14>14</option> <option value = 15>15</option> <option value = 16>16</option> <option value = 17>17</option> </select> <select name = "returnMinutes"> <option value="unselected">min</option> <option value = 0>00</option> <option value = .5>30</option> </select> </td> </tr> <tr> <td> First Name: <br/> <input type = "text" name = "firstName"/> </td> <td> Last Name: <br/> <input type = "text" name = "lastName"/> </td> </tr> <tr> <td> Street: <br/> <input type = "text" name = "street"/> </td> <td> City: <br/> <input type = "text" name = "city"/> </td> <td> Zip:<br/> <input type = "text" name = "zip" maxlength = "5"/> </td> </tr> <tr> <td> Date of Birth: <br/> <input type = "text" name = "date" value = "(mm/dd/yyyy)"/> </td> </tr> <tr> <td colspan = "3" align = "center"> <input type = "submit" name = "submit" value = "Submit Reservation"/> </td> </tr> </table> </form> </body> </html> I am trying to execute a simple window.close function to be used in IE8 and IE9, and window.close() doesn't seem to be working. Are there any known fixes?
this is quite embarrasing as i've done it before, but oh well... trying to close a window that is opened with a built-in dreamweaver function called MM_openBrWindow(). trying to use this code: PHP Code: if ($OutsideVisitors == "false") { echo '<center><strong><em><font size="4">THERE HAVE BEEN NO VISITORS TO THE WEBSITE TODAY... </font></em></strong><br><br><input name="closeme" type="button" id="closeme" value="Close Window" onclick="Window.Close()"; /></center>'; } i have also tried: PHP Code: onclick=javascript:Window.Close() it's just not behaving for me. any hints anyone? thanks a bunch! (the BrWindow() function in DW does open a popup window, so I think the js close() should work. if i remember right, a popup window is a prereq for that function to even work...) I am working on my homework. On my page, I need to make a modal window, which is just a picture has x or close letter, shows up whenever people open the page. So far, I called a picture with onload in a body and centered the picture. I don't know if there is anyway that I can just put x or close somewhere so that whenever people click x or close, the picture is not going to be visible ( promoPic.style.visibility = "hidden" this is my code for the picture. And I though I can just put input button or any letters inside of picture because its wrapped by paragraph, but, I can't. I guess I am miss understanding some concept? Code: <body onload="promoCenter()"><p><img src="http://codingforums.com/images/hauntedHouse.jpg" id="promoPic" alt="Haunted House" height="400" width="400" /></p> Hi guys, I have read that the window.close won't work unless the window was opened through window.open. Eventhough I have the window opening through window.open method the window.close simply wont close the window. Below is my code. I appreciate you help as I am desperate to finish my project and this is the only thing between me and the closed project. I have this in the <head> in the parent window. Code: <script language="javascript"> function MM_openBrWindow(theURL,winName,features){ var left = (screen.width/2)-(800/2); var top = (screen.height/2)-(560/2); features = features + ",left=" + left; window.open(theURL,winName,features); } </script> the left and top is to center the window which is working. Then I have the below code in my button which is to open the window. Code: <input type="button" value="E-MAIL" onClick="MM_openBrWindow('email.php?camp_id=<?php echo $encrypted; ?>','','width=860,height=600'); return false"/> The $encrypted is created beforehand and the window gets opened as well. Now in the popup window... Up on submitting a form, I need the popup to close after saying 'email has been sent'. this is the code for calling the fuction Code: echo "<script language='javascript'>success();</script>"; I get the alert too. Code: function success(){ alert('E-Mail Sent Successfully'); window.close(); } I even get the alert mentioning "E-Mail Sent Successfully". But simply the window is not closed. Can you guys please shed me some light on this.... Your help is greatly appreciated Ohh and by the way I'm running FF8. Cheers E Been trying for three days to find a way to self close a FF window. The window is opened from a link on a board, and its only purpose is to run an onLoad script that launches a popup window, after which I need it to close itself. There are any number of ways to do this in IE, but nothing works in FF - the parent window remains open. Seems ridiculous that something so simple can't be done. Any help would be appreciated. Thx. I have a form that lets users click on date time value that is a link. When the link is clicked, a pop up opens up allowing the user to change the date and time. When they submit the date/time change form, the pop up is supposed to close and the date/time i the original form should be updated. This works in IE, but not FireFox. Inital form code: Code: function openTimeWin(windowURL, windowname) { var strHelpOptions = 'toolbar=1,location=0,directories=0,status=0,menubar=0,scrollbars=0,resizable=0,width=320,height=230'; mywindow = window.open(windowURL, windowname,strHelpOptions); mywindow.moveTo(5,5); mywindow.focus(); } Code: <A HREF="javascript:openTimeWin('CallLoggerTime.cfm?SCDate=#URLEncodedFormat(DateFormat(StartCall,'mm/dd/yyyy'))#&ECDate=#URLEncodedFormat(DateFormat(EndDefault,'mm/dd/yyyy'))#&SCTime=#URLEncodedFormat(TimeFormat(StartCall,'h:mm:ss tt'))#&ECTime=#URLEncodedFormat(TimeFormat(EndDefault,'h:mm:ss tt'))#','TimeWin')">#TimeFormat(StartCall,"h:mm:ss tt")#</a> Pop up window relevant code: Code: <script language="Javascript"> opener.ThisForm.StartCall.value = "#newStart#"; opener.ThisForm.EndCall.value = "#newEnd#"; opener.catchdummy.prematureflag.value=0; opener.ThisForm.submit(); self.close(); </script> Anyone know what's up? Thanks! I want to capture Window close event. UnLoad will not help me as this event will be called whenever it is redirected to other page. I want as soon as user try to close the window i want to display an confirm message if user Click Ok then browser will be closed and if cancel it will not. Can anybody help me out on this. Dhiru Hi! I need to open a window when: 1 user leaves the site 2 when the browser is closed. I tried the 'unLoad' event but it works only for the user leaves site case and not the browser close. Here is the code I tried: <html> <head> <title>Detecting browser close </title> <script type="text/javascript"> function doUnload() { myWin= open("exit_site.php", "exitWin", "width=50,height=50"); } </script> </head> <body onunload="doUnload()" <h4>Close browser!</h4> </body> </html> Neep your help, please Hi folks, I've got a chat program which relies on a column in a MySQL database to see if he/she has logged out or not. But if you close the browser window, the computer still thinks you're online. I wrote this in the JavaScript section cos I think it would definitely need Javascript. So any help for updating the database in any way? Thanks!! Lucas Hi all, I have a HTML and I am opening another link in a separate window using window.open() . The child window is something like 'http://yahoo.com' which is out side html. I need to refresh the parent window when the child window is closed. any idea? Thanks, Mahesh I have a system on my website that logs users in. Once the user is logged in, I need the popup window that it takes place in to close and the parent window to refresh. This system could go through different pages depending on if the user has even been there before, etc., but the ending page will always be the same. I tried writing my own JavaScript for this, but since I do hardly any work with it, I can't get it to work quite right. Here is what I have, which I believe to be pretty close to what I want the end result to be: Code: <script type="text/javascript"> var iframe = document.getElementById("IFRAME ID").contentWindow.location.href; var url = "ENDING PAGE URL"; function LoadFrame() { if (iframe == url) { window.close(); if (window.opener && !window.opener.closed) { window.opener.location.reload(); } else { } </script> So I guess that I'm asking what do I need to change/add/fix/get rid of/whatever to make this work? The web page belows works OK in IE and FireFox on XP and Windows7 It does NOT work on IPAD using Safari. Question: How can I delete the new window("IPADREPORT") when I run it the second, third,fourth, etc time ? How can I get the window name( "IPADREPORT") to see if it exists? SUggestions? TIA, Steve42 <code> [aSafari.html] <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="en"> <head> <script language="JavaScript" type="text/javascript"> function pReport(){ // 1-17-12 var menuWindow = open("","ipadreport"); // 1-17-12 menuWindow.close(); // above closes previous report window var menuWindow = window.open('','ipadreport');// 1-17-12 document.ipadreport.submit(); menuWindow.focus(); } </script> <title>Ipad_PopUp_Test</title> </head> <body> <br><br> <form method=post name="ireport" target="ipadreport" action="http://myreport.asp"> <input type="hidden" name="reporttest" value="apple"> <a href='javascriptReport()'> Create Report</a> </form> </body> </html> </code> |