Library code snippets

User-Friendly Validation using ErrorProvider

Introduction

Data input validation in Windows Forms is essential. Built-in validation doesn't go much further than an enforcable maximum length for textboxes, but there are some nice methods you can use to make validation a breeze.

When a user is tabbing fast through a dialog entering data, they are sometimes going to get it wrong. We're only human, and this is natural. When we do get it wrong, however, we don't want to be bugged about it. The last thing we need is for a Message Box to pop up when we tab away from a field, telling us it's invalid. That would be an unnecessary interruption. Also, we don't want all the validation done when the user presses the OK button, because they could then potentially be given a great big message with all the fields that are wrong. So what we need is a method of unobtrusively showing that data is invalid, and presenting it in such a way that it is immediately obvious what is wrong and what to do about it.

Enter the ErrorProvider

This little Gem is often left unnoticed, which is a funny thing considering it sits in the Windows Forms Controls Toolbox by default. It is a component rather than a control, so when you put it on your form it will sit in the component tray below.

What this component can do is display a little red icon beside any control which is invalid. When the user hovers their mouse over this icon a tooltip is instantly displayed with information about the invalid field. It can also optionally blink the icon. While this may sound trivial, it's actually rather useful.

Using it on a form

Create yourself a form, with a textbox on it. Put an ErrorProvider in your component tray too. Now, in the Validating event of the textbox you need to put the code to test the contents for validity and optionally display the error icon. It's up to you how you do your validation, it could be as simple as text length constraints or as advanced as regular expressions matching.

    private void txtTown_Validating(object sender,
    System.ComponentModel.CancelEventArgs e)
    {
        if (txtTown.Text.Trim().Length == 0)
            errorProvider.SetError(txtTown,
            "Please enter the customer's town.");
        else
            errorProvider.SetError(txtTown, "");
    }

You can have as many error providers on a form as you wish, but I can only see a potential use for two. You could have one with a yellow icon rather than red, for when a field is valid but could be better.

Example code

I have attached a sample project written in C#, which has a typical (though simplified) data entry form for some customer information. You will find as you tab through the textboxes on the form, that you will get the error icon appearing unless you enter data in the right format. Hovering the mouse over the error icon will tell you what is wrong and how to fix it.

Comments

  1. 14 Feb 2007 at 22:41
    Note that in .NET 2.0 the ErrorProvider control has a known bug where the error message can sporadically disappear and not come back unless the error text changes. One (rather complicated) fix may be found at http://www.codeproject.com/useritems/ErrorProvider_ToolTipFix.asp. Please follow up there if you've found a more straightforward solution to this problem.
  2. 10 Jan 2007 at 19:25

    Hello,

    I've used the Focus() method to get the control to re-validate programmatically...  You'd switch the focus from where it is curently to the control you want to validate and back... Like so...

    txtData.Focus();

    sender.focus();

     

    If anyone has other suggestions, I'd love to hear them.

    Hope this helps.

    thx...d.

  3. 06 May 2005 at 11:27
    I haven't been able to find any method for programaticly triggering the validation on a TextBox.
    Now I set the focus on the TextBox and then to some other control to trigger a validation.

    I need a more elegant way to trigger a validation on a TextBox from the code.

    (
    consider the following example:

    I have a form with a combo and 2 textboxes. Changing the selected option in the combo fills the textboxes with the related data from a database. Now the user enters invalid data in one of the textboxes. The errorProvider activates and the icon blinks next to the textbox. The users changes his mind and selects another item in the combo (dropdown list). The textboxes are again filled with relevant data from the database. However the error provider leaves its blinking icon next to the textfield and the user cannot save the data (if he made changes to the other textbox).

    I know that I could clear all errors when the selected item in the combo changes, but I'd like to find something more elegant and suitable for other situations as well,  like

    txtData.Validate(); or
    errProvider.Validate(txtData);
    )
  4. 24 Nov 2004 at 06:04

    hi tim first of all this is a nice article, i just have a question
    of how do we force the errorprovider to show when the textboxes are in did empty?


    tia!

  5. 01 Jan 1999 at 00:00

    This thread is for discussions of User-Friendly Validation using ErrorProvider.

Leave a comment

Sign in or Join us (it's free).

Tim Dawson

We'd love to hear what you think! Submit ideas or give us feedback