Validation / Dirty Flag: should we force users to fix invalid entries before they move to another screen in the software?

Question

Scenario:

• User makes a series of entries in text fields on a page that requires apply/cancel buttons.
• Invalid entries are flagged with an error icon and hover-over tooltips that explain the validation error.
• The "apply" button remains disabled until all fields are valid; users cannot apply invalid entries
• BUT the user is still able to navigate away to another page of the software, at which point they receive a dirty flag notification: "You have changed some settings blah blah, would you like to apply them before leaving this page? (Apply/Don't Apply/Cancel)"

Problem:

• How do we handle the case where the user clicks "Apply" in the dirty flag dialog while they still have invalid entries?

Considered solutions:

• After they click "apply", they receive an error dialog stating "Some settings are invalid, could not apply" and the invalid entries are rejected, reverting the fields to their previously saved states. After user closes error dialog, they move to their destination page.

• We include a message in the dirty flag dialog along the lines of "Only valid entries will be applied, invalid entries will be reverted to last state." When the user clicks "apply" in the dialog, they move to the destination page and only valid entries are applied

• Before the dirty flag dialog even appears, the user receives a notification dialog stating "Some entries are invalid, please fix before continuing." They fix the invalid fields and try to leave the page again, at which point they encounter the dirty flag dialog.

We're in a conundrum about which solution is the most elegant. This whole situation is awkward to begin with, considering the few cases where a user would try to leave a page without applying their changes... But yeah, which of these, or others, would best be the most appropriate solution for us?

Answer 1

Now, for something completely different...

An application for submitting tax returns that I have worked on, approached the "invalid" data entry in a completely different way:

• The user could always safe. Valid or not, complete or not, required info filled out or not, data was always saved.
• An "errors, warnings and info" screen held all validation messages and could be shown next to the normal data entry.
• A tax return could not be submitted if there were still any errors.
• Submitting a tax return when there were still warnings required confirmation.
• Submitting a tax return when there were only information messages went ahead immediately.
• The 'submit tax return' action showed different icons depending on the validation state.

Reasoning behind this approach:

• Filling out a tax return is something you usually don't do in a single session.
• Workflow should not be interrupted just because you cannot recall someones tax-id.
• Users should be able to safe the work they have done at any time, even if it doesn't validate yet.

What it boils down to:

• Don't prevent someone from saving what you consider invalid data.
• Just prevent them from performing any action that requires the data to be valid.
• And don't forget to tell them why they can't perform that action.

Answer 2

I suggest to modify the "dirty flag notification" so it will not ask user to "apply" or to "not apply", but to "review the changes" ("stay at that screen", etc) or to "forget the changes" instead, like it's done at this site in a case you want to refresh the page and have unsaved content in a text area:

I think that this solution is simple and more clear to the user: you have something unsaved here so you may stay and review (apply, etc) or forget it.

Answer 3

Couldn't there just be 2 states, valid and invalid (or complete and incomplete) with each state clearly indicated (by color or underlines of something), and everything saved by default (no prompting to "save" or "cancel"), with an added operation like "list everything that's incomplete"?

It seems like this notion of always-in-saved-state is becoming more popular and acceptable, and it is conceptually simpler so it might help your case where you have an additional state (valid/invalid).

Answer 4

I think that if some info is not neccessary, but not valid as well, you can warn the user, but grant the ability to continue. Like: "The following fields were entered incorrectly. If you continue, you might loose some information. {lines of dirty fields} [continue anyway] [back to form]"

Answer 5

There are 3 things I've started to see on web sites that I think are great and would suit your situation.

1. Every field that is required should be visually marked as such to let the user know the minimum they need to fill in (minimum as in what the system/db needs for correct operation, not minimum to harvest info for marketing purposes).
   There's nothing more annoying that every field being highlighted as required when I know some of what they're asking for isn't necessary at all!

2. Every required field (if possible) should have client-side validation with a visual indicator (a green tick is the common I've seen) to indicate successful entry of valid data.

3. Where there's any ambiguity a field should have a 1-line explanation below it with (if necessary) a link to a dialog giving further details & an example.

This way all the validation, notifications are done inline and in real-time to provide the user with the smoothest experience possible.

Only once all the required fields have been filled in and validated should the user be able to click Apply and progress to the next step/screen.