15

I'm working on a registration form with real-time inline validation. I'm wondering when we should trigger error messages:

  • before, when the field is in focus and until the user has entered a valid answer
  • while, when the user is typing and until the has entered a valid answer
  • after, when the field is out of focus

Field validation

Improve this question
4
  • With "before", you mean that when the user sees the form for the first time, there will already be error messages saying that the fields were not filled yet?
    – Heitor
    Commented Mar 6, 2015 at 12:10
  • The error state of the field would be triggered on focus.
    – user25518
    Commented Mar 6, 2015 at 12:22
  • What is the form used for? How many fields are in the form?
    – tohster
    Commented Mar 6, 2015 at 12:50
  • It's a registration form and there are 8 fields in total.
    – user25518
    Commented Mar 6, 2015 at 12:52

3 Answers 3

Reset to default
11

One relevant study that springs to mind is described by Luke Wroblewski in Inline Validation in Web Forms. It found that validating inputs prematurely can be harmful and that validating fields after input helps users to complete forms more quickly and accurately.

To better understand when to show inline validation messages, we tested a few variations in the top half of our form.

After

In this version of the form, we displayed a validation message (success or error), after the user indicated that she was done answering a question by moving on to the next one. (This is validating “on blur” in technical speak.)

While

In this variation, we displayed (and updated) a validation message while the user answered each question. (That is, “on key press.”)

Before and while

In this version, we displayed a validation message before the user answered each question—that is, as soon as they focused each form element—and then while they answered the question. (This is validating “on blur and on keypress.”)

It concluded that:

When we used the “after” method in the first half of the form, participants completed the form seven to ten seconds faster than when we used the “while” and “before and while” methods respectively. The “before and while” method not only caused longer completion times, but also produced higher error rates and worse satisfaction ratings than the other inline validation variations we tested.

General rules

  • For open-ended questions, give feedback after the user finishes providing an answer (on blur, when they move on to the next field).

  • For questions that the user might need help with sooner (e.g. username and password fields), give feedback while they are typing but use an appropriate delay so that premature error messages don’t frustrate them.

Improve this answer
1
  • What about when the user returns the focus to a field that is displaying an error message that was originally applied on blur (in order to make a correction)? Should the error message be cleared immediately upon the user changing the value to be valid? Or should the field wait until on blur to clear the error message? (The latter seems potentially sub-optimal: The user has to click or tab away from the maybe-correct value before they can see if their attempted correction was successful?)
    – Jon Schneider
    Commented Oct 22, 2021 at 15:26
0

Show error messages before the user even started filling the form can be misleading since the user haven't started to fill the form yet. From what I've seen in common forms, the error messages appear usually when the system recognizes an error while the user try to submit. This can also be misleading, especially when there is a large form and the error occurred somewhere at the beginning of it. Therefore, I think that the best way is to show the error message of a field after focusing on it once and moving to the next one.

Improve this answer
1
  • you make very valid points, but for the best answers you should try finding and demonstrating examples, finding sources to back up claims and formating the answer so it isn't just one block of text
    – Toni Leigh
    Commented Mar 8, 2015 at 14:09
0

Email id validation when focusing the inputfield - Till you enter valid id error message will fire - once you enter proper mailid formate error message will hide enter image description here

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.