How do I tell the web browser that the user has modified the page?

Question

I let the user do some visual setup on a html page. It may take some time so I do not want the user to loose the setup done by closing the web page in some way (without a warning).

If I had used text areas, check boxes etc then the browser would warn the user. How do I tell the browser to warn the user in my case?

set a flag upon modification, check before leaving the page. — dandavis, Jan 17 '14 at 17:42
Oh, thanks for the help everyone. I tried but did not find the answer here. — Leo, Jan 17 '14 at 18:03

score 5 · Accepted Answer · answered Jan 17 '14 at 18:05

5

You can use a global variable like "unsavedChanges" in below example. Then you need to set that variable if user change anything. Or in any condition when you want that confirmation before user close the web page.

 var unsavedChanges = 0;
 window.onbeforeunload = function (e) {
    if(unsavedChanges != 0){
         e = e || window.event;

         // For IE and Firefox prior to version 4
         if (e) {
            e.returnValue = 'There is some unsaved changes!';
         }

         // For Safari
         return 'There is some unsaved changes!';
    }
};

answered Jan 17 '14 at 18:05

Hannan Hossain

740
1
12
23

Thanks, yes, that is what the comments above says too. What is the practice here now, should I choose this as the answer, or? (It was already answered before.) – Leo Jan 17 '14 at 18:07
ohh! I didn't see that anyone answered already.. – Hannan Hossain Jan 17 '14 at 18:11
Your answer was very welcome. I just do not know how to be fair to you and the others... ;-) – Leo Jan 17 '14 at 18:13

score 0 · Answer 2 · answered Jan 17 '14 at 17:42

0

Browsers will usually get this information through HTTP headers sent with the page.

For example, the Last-Modified header tells the browser how old the page is. A browser can send a simple HEAD request to the page to get the last-modified value. If it's newer than what the browser has in cache, then the browser can reload it.

There are a bunch of other headers related to caching as well (like Cache-Control). Check out: http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html

answered Jan 17 '14 at 17:42

Avinash Babu

6,171
3
21
26

1

I think they are talking about the user modifying/filling in forms on the page, not modifying the actual page itself. – Xymostech Jan 17 '14 at 17:44
Thanks Code Lover, but the situation is as @Xymostech explained above. – Leo Jan 17 '14 at 18:04

How do I tell the web browser that the user has modified the page?

2 Answers2

Linked