[removed]: Is it possible to get any details about

Question

I'm developing one of those warning windows that tells the user that they may have unsaved data, but I only need it to warn them if they're leaving the page. Currently it does so on refreshes, postbacks, etc. I was wondering if there was any way to tell how the page was unloaded or otherwise get more details about what the user is doing to unload the page. (jquery solutions welcome).

Code for reference:

    window.onbeforeunload = function () {
        if (formIsDirty) {            
            formIsDirty = false; 
            return "Are you sure you want to navigate away from this page?";
        }
    }

Answer 1

on beforeunload event we can do below things:

1. We can pass event as a parameter to the function as in above answer. Now we can use this event for available information attached to this event.
2. And we can access Document level variables.

For example document.activeElement will give you the last element you clicked that caused the page unload.

Hope this helps!!

Answer 2

Short answer: There's no easy way to find out what is causing onbeforeunload to fire.

Long answer: Inside your window.onbeforeunload handler you can access the window.event object, which may have some useful properties to determine how the window is closing.

For example, if window.event.srcElement is an anchor tag, then you know that the onbeforeunload event is firing by an anchor tag being clicked.

Refer to the event and onbeforeunload pages on MSDN for more properties.

Edit: some more info I have stumbled across -

If you want to ignore ASP controls that cause post-back, you can interrogate the '__EVENTTARGET' hidden input. If this input has a non-empty string value, then the page is being posted back by an ASP control.

You could also check the keyCode property (if F5 has been pressed, causing a refresh) or the mouse position to see if the X (close) button has been clicked.

Answer 3

I was running into a simular issue when a user was hitting enter from an input field on a form. The form was being submitted thus firing off the onbeforeunload event. I tried setting a flag to avoid showing the message on the keydown event on the input, filtering on the enterkey code. This wasn't getting triggered until after the onbeforeunload event was firing and therefore the flag wasn't getting set.

I then looked into the _EVENTTARGET as jbabey suggested. If the form was being submitted there would be a value in that field, if it was being refreshed there wouldn't.

Therefore, doing a simple check to see if there was value in the _EVENTARGET field in the onbeforeunload event could determine if the input from the form was causing the postback.

Here is my code.

            window.onbeforeunload = function (e) {
            if ($('[id$=__EVENTTARGET]').val().indexOf('btnValidateMaterials') != -1) {
                confirmExit = false;
            }

            if (DateOrQtyHasChanged() && confirmExit) {

                if (/Firefox[\/\s](\d+)/.test(navigator.userAgent) && new Number(RegExp.$1) >= 4) {
                    var message = $('[id$=hfLeaveMessageFF]').val();
                    if (confirm(message)) {
                        history.go();
                    }
                    else {
                        window.setTimeout(function () {
                            window.stop();
                        }, 1);
                    }
                }
                else {
                    var message = $('[id$=hfLeaveMessage]').val();
                    return message;
                }
            }
        }

Answer 4

I think that the active element is not a valid solution.

I can't comment the "open and free" solution, I dont have reputation.

document.getActiveElement gets the currently focused element in the document. If a link have the focus and I press F5 or I close the tab the active element is the link.