EmailAddress field validation

The Required validation was straightforward, but email validation is a little bit different; each developer would adopt different approaches for the validation. The emergence of jQuery validation provided consistent behavior for most of the validations. Later, the standard set by the HTML5 team is not adopted widely by all browsers and development teams.

Let's explore the EmailAddress built-in validation which would allow us to validate whether the value is a valid email or not. The following steps will help us in understanding how validation works:

  1. The data annotation was already discussed; we will be using the EmailAddress attribute in this section.

  2. The MVC engine scaffolding part, the validations, populating model state errors, and displaying errors on the screen, almost the entire process, would be the same for the remaining of the chapters. We can additionally cover how the validation is performed in each section as each of the in-built validation follow different patterns.

The validation error can be captured in the EmailAddress data annotation in the following scenarios:

  • If the field does not have the @ symbol followed by one or more character(s) (for instance, a or a@), then the validation error will be reported to the user

  • After providing the @ symbol following one or more character, if we introduce a . (period) then the validation engine will expect the field value to be followed by one or more characters, and if not satisfied it will throw a validation error (for instance, a@a.)

The EmailAddress attribute/data annotation can be configured as follows:

    public class User
{
// Code removed for brevity
[EmailAddress]
public string Email { get; set; }
}

As seen in the previous section, the scaffolded HTML code follows the same data attribute-driven approach for validation. The highlighted section in the following screenshot illustrates that the validation is performed using data-attribute driven validation:

The preceding method will force EF to emit a standard validation error message, The Email field is not a valid e-mail address., if the field contains invalid data during validation, as shown in the following screenshot:

We can see that just after providing a value after the @ symbol, the error is removed, even though the email is not yet complete, as shown in the following screenshot:

Introducing a . (period) symbol would again throw an error as the email is not complete without the complete domain name in the email, as shown in the following screenshot:

We can also see that after providing one or more characters, the error is removed, and now we have a valid email value, shown as follows:

We can configure the custom error message for each model field, shown as follows:

    public class User
{
// Code removed for brevity
[Required(ErrorMessage = "Email is required"]
[EmailAddress(ErrorMessage = "Provide a valid email address")]
public string Email { get; set; }
// Code removed for brevity
}

The preceding method will force EF to emit the custom error message, Provide a valid email address, if the field contains invalid data during validation, shown as follows:

The custom error would still work or be consumed for throwing invalid domain validation errors as well:

The displayed error message will be cleared once the user starts typing a valid email value into the field.

The valid email value was decided by checking the @ symbol of the value; mysteriously, it clears the validation (test@somedomain) before the user completes the email with a valid domain name (gmail.com or yahoo.com). Once the . value is provided again, it displays the error message, expecting the user to provide any domain extension value such as.com or .net (it works perfectly, even if we provide .abc).
..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset