Email Validation

Overview

There are many times when we want to validate that user input is in a certain format. We might do this to ensure data integrity, prevent errors, or just to make sure that the user and the application are thinking about the same thing. Delphi's VCL includes the TMaskEdit component which can be used for this type of application, but TMaskEdit can be confusing and unwieldy from an end-user's point of view. The TwoDesk Component Library validator components offer a different solution to this problem that we think is more flexible and better suited to the needs of the end user.

In this example, we're going to create a dialog that asks the user for an e-mail address, and won't allow the user to click OK unless a valid e-mail address is entered.

What is Valid?

Of course, before we can decide whether a particular piece of data is valid, we have to define what makes the data valid. Common ways of doing this are checking for length, content, convertability (in the case of numbers), or using regular expressions. The TwoDesk Component Library provides general-purpose validators that use each of these methods, as well as some specific ones. One of the specifics is an e-mail address validator, which is based on the regular expression validator. To see the specific regular expressions used, look at the TwoDeskValidators unit of the library (at the time of this writing, the regular expressions are all right around line 763).

Creating the Form

First we need to create our form. Create a new form, sized to about 130x320. Drop a TButton on the lower right corner of the form, call it btnOK and make the caption OK. We'll leave out the Cancel button just to keep things simple for this example. Drop a TEdit on the form, and size it appropriately. Add a label to tell the user what to do. Your form should look about like this:

Now we need to add the validator component. From the TwoDesk Validators section of the component palette, drop a tdEmailAddressValidator on your form. Name it Validator.

Validator Properties

In order for the validator to be useful, we need to set certain properties. For the e-mail address validator, we only need to set the Control property. The defaults will do for the other properties. Set the Control property to Edit1. This will cause the validator to look at the contents of Edit1 to see if it contains a valid e-mail address.

Write a little code

To finish our dialog, we need to write just a little bit of code. We want our OK button to be enabled only if the edit control contains a valid e-mail address. So, we'll set the Enabled property of btnOK in the OnChange event of Edit1. Double-click on the edit control to create the event handler, and create the following code:

procedure TForm1.Edit1Change(Sender: TObject);
begin
  btnOK.Enabled := Validator.Validate;
end;

You will probably also want to set btnOK.Enabled := False in the form's OnCreate event, so that the form's initial state will make sense.

Try it Out!

Run the application, and type an e-mail address into the edit control. You'll notice that as you type the mailbox name, the OK button stays disabled:

Once you enter a domain, however, the OK button becomes enabled:

Conclusions

This should give you a basic feel for how the validator components work, and what they can do for you. For more fun with validators, we encourage you to experiment with the components on the TwoDesk Validators tab of the component palette.