flutter / uxr

UXR work for Flutter
BSD 3-Clause "New" or "Revised" License
229 stars 28 forks source link

Form with modifications and change of url on the web #74

Closed ghost closed 3 years ago

ghost commented 3 years ago

Hi One scenario that I think you have not taken into account is the web form pages. If a user is making modifications to a form on a web page and puts a different url to open another page, there should be an easy and standard mechanism for asking a question "Do you want to exit without saving the modifications?". If the user says "no" it should not be possible to navigate to the other page and stay on the page that has the form with the modifications. Thanks. Regards, Jose A.

InMatrix commented 3 years ago

Hi @Josua2012, thank you for suggesting this scenario. Cc a few package authors for their consideration / response: @lulupointu @slovnicki @Milad-Akarie.

tomgilder commented 3 years ago

This is possible using the native onbeforeunload DOM event. Might be worth having this as a totally separate package, could be made in a generic way that is usable with all routing packages.

Milad-Akarie commented 3 years ago

I did some research a while ago and turns out you can't block browser's navigation arrows that easy, you'd have to push a fake entry with the same url but different state, then listen for the DOM event popstate which is triggered AFTER the current state (the fake one) is popped, from there you can show a Flutter Alert dialog and have it pop again on confirm-exit or repush a fake entry on cancel-exist.

onbeforeunload works only when the user hits the refresh button and If I remember correctly you can't set a custom message in most modern browsers.

I might give it another try now that we have the option to replace the current url.