1

I have a requirement to pop up a warning when a user attempts to leave the page, close the tab, or the browser itself. I was able to successfully build that with the window.onbeforeunload call below. The customer since revised the requirement to only have the pop-up when there is an unsaved edit on the web page.

I have added a sessionScope.Changed = true for the necessary fields onChange events on the page and reset the value to false when Save is clicked. I have confirmed that the sessionScope variable is being set properly. However, no matter what the value is - true or false, I cannot get the popup to fire correctly. I have also tried wrapping the if/then around the window.onbeforeunload line and left the function with just the return message.

Is the sessionScope simply not available on a page script or am I referencing it incorrectly or is it something else?

EDIT: My page uses a series of stack containers to simulate a tabbed interface. This construct appears to thwart the built-in enableModifiedFlag once the user clicks to another tab without saving, which is why I went down the path of the sessionScope variable.

Thank you in advance!

  <script language="JavaScript">
      var ch = '#{sessionScope.Changed}';
      window.onbeforeunload = confirmExit;

      function confirmExit() {
       if (ch == true){
         return "You have attempted to leave this page.  If you have >       made any changes without clicking the Save button, your changes will >       be lost.  Are you sure you want to exit this page?";
        }
       else { 
         return "";
     }  
  </script>

3 Answers3

2

The most likely problem is a misunderstanding on timing. If you view the source HTML, you'll see there is no reference to #{sessionScope.Changed} on the browser page. That's because Expression Language (#{sessionScope.Changed}) can only be evaluated on the server. So the result is then passed as a literal value into the client-side JavaScript. So unless you're doing a partial refresh whenever something is changed, the value will not be updated, so you'll be testing against the value as it was when the HTML was first passed to the browser.

Paul Stephen Withers
  • 15,699
  • 1
  • 15
  • 33
1

You are setting var ch='true' but then trying to test if it is the Boolean true

Remove the single quotes from the declaration line

Hope that helps

MarkyRoden
  • 1,074
  • 6
  • 21
  • Well, I totally agree on using the right data type. However, as he is using "==" to compare (as opposed to "===") Javascript _should_ convert the type and compare it correctly in this case - if I have understood the use of "==" correctly ;-) – John Dalsgaard Oct 23 '15 at 07:08
  • I removed the single quotes, same outcome. – Paul Stockinger Oct 23 '15 at 17:24
1

Use XPage's build-in functionality to show a warning leaving unsaved page with edited fields (instead of own CSJS code with window.onbeforeunload):

<xp:view
    xmlns:xp="http://www.ibm.com/xsp/core"
    ...
    enableModifiedFlag="true"
    modifiedMessage="You have attempted to leave this page....">
Knut Herrmann
  • 30,880
  • 4
  • 31
  • 67
  • 1
    I tried this. It worked intermittently at best, especially as my xPage uses stack containers, so if I switched "tabs" on the page it would no longer consider the unsaved edits to be dirty. – Paul Stockinger Oct 23 '15 at 17:10