I am developing an AngulrJs single page app with a permanent set of buttons for navigation.
Among other things, the user can add some data or edit existing data.
What should I do if he pushes a navigation button when the form is partly complete?
Of course, I will pop-up a dialog to warn the user. And I can hardly prevent him from navigating away (not good UX).
So, if he navigates away, and then returns, should I have saved the partial data for him, or must he start anew?
From what I understand, I wouldn't go an ask the user what he wants to do, because we'll assume that this is the wanted action. In such a case, you'd need to provide a draft-save; as some required fields aren't filled in yet. Due note, that a good working auto-save isn't that trivial, as you need to think about a lot more now. For instance, the biggest question is often "When to save? Is it periodic or at a keyup event?". I'd take the following in consideration:
As the user navigates back or forward, he should at least get a notification that the save has occured, with some clear notification depicting that there are, in fact, some drafts available. Test if the notifications are clear and that the drafts can be easily managed. You could think about using a fixed amount of draft slots, so that this doesn't overflow into something unmanageable.
To accomodate for a slip, you could give the last saved draft for a fixed time span, say a minute. If the user returns to the page, he'll get the restored version, if not, at least a way to retrieve the draft. Although, the time constraint could make the system look "unpredictable"; timings and expectations should definitly be tested out for this case. I think most implementations stick to the "always show last draft" option, without a timing constraint.
Definitly take a look at good implementations, like google docs for instance as that is something that some people will reflect to when using your system.
sources:
