How to create an 'Are you sure you want to leave' message

Hi Wix Velo community,

If it is possible, how do you create a message where it says “Leave Page? Changes you made may not be saved.” (see screenshot). And, is it possible to have the text say something else? Thanks.

AuroraPBC

Hi there,

You can set that manually via code by adding a function to every event handler to first check whether the changes are saved or not (by a global Boolean), then show the message.

Here’s a simple example:

let saved = true;
$w('#navigateToHome').onClick(() => {
    if (saved) {
        wixLocation.to('/');
    } else {
        wixWindow.openLightbox('Changes Reminder').then((answer) => {
            if (!answer) { answer = {} }
            if (answer.approve) {
                // user wants to go anyway.
                wixLocation.to('/');
            } else {
                // User decided to continue editing.
            }
        })
    }
})

This goes for all the events that can navigate you to another page or section on that page.

Keep in mind that direct navigations and links on the menu, or other places will not work.

Hope this helps~!
Ahmad