0

On a single page application, the client is editing a big form at

localhost/#!/product/123/edit

  • He navigates away, I want to display a confirm dialog "Are you sure to leave?" [OK] [Cancel]. If he click on [Cancel] he must stay with the form.

  • Here is my current implementation

page.exit('*', function (ctx, next) { if (form is editing and not submitted) { if (confirm("Are you sure you want to leave")) { next(); //user click OK -> leave } } else { next(); //nothing changed on the form => leave } });

The problem: each time I click on a link ('/foo') and cancel the leaving. The page content (my big form) stay untouched but page.js will still pushState('/foo') and the window.location changes to '/foo' which is no longer corresponding with the page

how can we really cancel the pushState, and left the address bar stay untouched at localhost/#!/product/123/edit

laser
  • 1,388
  • 13
  • 14
Hiep
  • 2,483
  • 1
  • 25
  • 32

1 Answers1

0

I had the same problem, what I did is set

context.handled = false;

when I raise the dialog (a bootstrap modal). Works fine, except for a small glitch: If I modify some input field, then attempt navigation to clicking a link, then choose to stay in the page, then if I hit the same link, no action is triggered. Other links work fine.

See the corresponding issue in github.