SitePoint Sponsor

User Tag List

Results 1 to 16 of 16

Thread: window.close

  1. #1
    SitePoint Member
    Join Date
    Jan 2010
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    window.close

    I have a popup window. When a user click 'x' on the upper righthand corner to close the window, I want to display and message with yes or no option. Would you let me know how I can do this?

    Thanks,

    Beginner

  2. #2
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,836
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    You can't do it.

    1. There is no yes/no dialog available to JavaScript - only OK/Cancel

    2. By the time the onunload event is triggered the page is already unloading so nothing selected after that will make any difference.

    3. Some browsers have a proprietary onbeforeunload event handler that can interrupt things at that point but there is still no way to distinguish why the current page is being unloaded - refreshing the page, loading a different page, or closing the tab would also trigger the event, not just closing the browser.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  3. #3
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,191
    Mentioned
    191 Post(s)
    Tagged
    2 Thread(s)
    Hi beginner12, welcome to the forums

    Do you really want to do this?

  4. #4
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,109
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)
    Hi, welcome to sitepoint!

    There is an onbeforeunload event on the window object where you can add a message to be displayed and have confirmation before the window is closed.
    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">
    function beforeClose()
    {
      return "Mssage...";
    }
    window.onbeforeunload=beforeClose;
    </script>
    </head>
    <body>
    </body>
    </html>

  5. #5
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,109
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)
    Quote Originally Posted by felgall View Post
    You can't do it.
    Whilst the browser support isn't 100&#37; I find it can be very useful - e.g. How GMail warns you if you're going to lose an unsaved draft.
    2. By the time the onunload event is triggered the page is already unloading so nothing selected after that will make any difference
    That's not true. Hitting cancel prevents the window from closing.

  6. #6
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,716
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by markbrown4 View Post
    Whilst the browser support isn't 100% I find it can be very useful - e.g. How GMail warns you if you're going to lose an unsaved draft.
    I fully agree. Thank you Google for showing us how these features can be successfully used "not for evil".
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  7. #7
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,109
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)
    Ahh, sorry you were writing about onunload which is correct.

  8. #8
    SitePoint Member
    Join Date
    Jan 2010
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by markbrown4 View Post
    Hi, welcome to sitepoint!

    There is an onbeforeunload event on the window object where you can add a message to be displayed and have confirmation before the window is closed.
    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">
    function beforeClose()
    {
      return "Mssage...";
    }
    window.onbeforeunload=beforeClose;
    </script>
    </head>
    <body>
    </body>
    </html>


    Thank you for the example. It worked for me.

    Does this work only for internet explorer?

    Thanks

  9. #9
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,836
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by beginner12 View Post
    Thank you for the example. It worked for me.

    Does this work only for internet explorer?

    Thanks
    There are one or two other browsers that implement it as well.

    Of course since onbeforeunload is often used to interrupt people leaving a page with the display of an ad there is a lot of incentive for people to turn that event handler off if they are using a browser that does support it.

    There are plenty of browsers that don't support it too since it is a non-standard event and so you can't rely on it for anything.

    The most useful use for the onbeforeunload event handler is with IE to test if the browser is allowed to close the window so as to not try if it can't. That gets rid of the dialog that IE pops up when the page can't close the window and makes it consistent with the behaviour of all other browsers.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  10. #10
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,191
    Mentioned
    191 Post(s)
    Tagged
    2 Thread(s)
    Even for browsers that do support onbeforeunload, as mentioned, that event can be triggered in more than one way. One thing that would work in all browsers is to put in your own "close this window" button or link and have that give the "you will lose entered form data" alert. Or you could make it easy and just put that statement somewhere visble on the page instead of using an annoying alert that may turn off visitors.

    If someone wants to leave, it probably isn't an accident, and such tactics will PO many.

  11. #11
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,836
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Those responses are particularly annoying when all you want to do is to relead the current page.

    There is no way to tell what the person is trying to do that triggerd the event - just that it is something that requires unloading the current page.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  12. #12
    SitePoint Member
    Join Date
    Jan 2010
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,

    I didn't want to display the message if the user did not keyed in any data. So I added codes shown below to go through all the fields to check whether the user keyed in any data or not. But the logic is not working. Any help would be appreciated.

    Thanks




    <script type="text/javascript">

    var valuesEntererd = false;

    function beforeClose(form)
    {
    var elements = document.getElementsByTagName('*');
    for (var i = 0, len = elements.length; i < len; i++){
    if ((elements[i].tagName == 'INPUT' && elements[i].type && elements[i].type == 'text') || elements[i].tagName == 'textarea'){
    if(elements[i].value != ''){
    valuesEntererd = true;
    break;
    }
    }else if (elements[i].tagName == 'SELECT' ){
    if (elements[i].selectedIndex != 0){
    valuesEntererd = true;
    break;
    }
    }
    }

    if (valuesEntered == true){
    return "All information entered will be lost.";
    }
    }

    window.onbeforeunload=beforeClose(this);

    </script>

  13. #13
    SitePoint Member
    Join Date
    Jan 2010
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Is there a way to change default message I am getting 'Are you sure you want to navigate away from this page?' and then 'Press OK to continue, or Cancel to stay on the Current page.' Can I only display 'my message' in between this two messages?

    Thanks

  14. #14
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,836
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by beginner12 View Post
    Is there a way to change default message I am getting 'Are you sure you want to navigate away from this page?' and then 'Press OK to continue, or Cancel to stay on the Current page.' Can I only display 'my message' in between this two messages?

    Thanks
    You only get that message in Internet Explorer. It means that your site didn't open the window and therefore your site isn't supposed to be allowed to close the window. The only way you can change the behaviour is to test for if the window is allowed to be closed first. Then you could change it to work the same as all other browsers by not running the window.close() if it isn't allowed.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  15. #15
    SitePoint Member
    Join Date
    Jan 2010
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I tried Firefox and it was giving me the same message.

    I do not quite understand rest of your message.

    Thanks

  16. #16
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,836
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    For the couple of browsers that understand the proprietary beforeunload that is the message they display. Since that is a non-standard event most browsers just ignore it.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •