"There are unsaved changes. Do you really want to leave the page?" dialog

[davidd4]

Hi Tobias,

I'd like to make a bahaviour as stated in the subject. When the user tries to leave the page and there are unsaved data, the dialog should open and the user should be able to cancel the leaving from page. I've searched through the angular/adapter code and found many broadcast messages (e.g locationChangeStart, routeChangeStart) occuring at location changes. But I've found no possibilities to cancel the location change. Is there any? A second problem is, that showing a dialog and waiting for the user's response is done in async way. So the system should wait for my "promise" to be done, and just after that sholud it go on with the location change. Any idea?

Thanks for your reply

[tbosch]

Hi, aborting a location change can be done using the event locationChangeStart and preventDefault (see the angular docs for details), e.g.

$rootScope.$on('locationChangeStart', function(e) {
    if (!changed()) return;
    event.preventDefault();

    $rootScope.$afterAsync(function() {
        $location.path("#confirmDialog");
    });
});

When the user clicks an "OK"-Button in the Dialog, you could navigate to the original target page.

Tobias

[tbosch]

Closing this. If you have further questions, please reopen. Tobias