Prompt user before exiting site in Visual Builder

If you want your user to not leave the site due to a process running or unsaved changes, you can use the window.onbeforeunload event listener. Here’s how you would do it in a Visual App.

Photo by Dustin Tramel on Unsplash

Create a module function to register the listener

This module function will register the event listener, you could also skip this part and put this in the index.html in a script block.

PageModule.prototype.registerListener = function() {
    
    window.onbeforeunload = (e) => {
      e.preventDefault();
      e.returnValue = 'you have unsaved changes. do you want to leave?'
    }
}

Call module function to register the listener

You can call the above module function on vbEnter of your edit/create page for example.

Register listener via action chain

Few things to note…

Few things to note:

1. For dialogs to appear, you would need some user gesture/activity on the window for chrome. Read more about it here.
2. Read more about the window.onbeforeunload and different ways for registering listener here.
3. You need to modify the module function if a certain browser unloads differently.

Versions

VB: 19.4.3.1

JET: 8.1.3