Data annotation attributes

10 Jan 202411 minutes to read

The DataForm component enables users to define the data annotation attributes available from the instance of System.ComponentModel.DataAnnotations.

Display attribute

The DisplayAttribute class is used to specify the display name for a property. The display name is used as the label for the corresponding editor in the DataForm component if label text is not specified for the form item.

[Display(Name = "Name")]
public string Name { get; set; }

Validation attributes

The DataForm component supports the following validation attributes from the System.ComponentModel.DataAnnotations namespace.

Required attribute

The RequiredAttribute class is used to specify that a property is required. The DataForm component displays an error message if the property is empty.

[Required(ErrorMessage = "Name is required")]
public string Name { get; set; }

Range attribute

The RangeAttribute class is used to specify the numeric range constraints for the value of a property. The DataForm component displays an error message if the property value is not within the specified range.

[Range(0, 100, ErrorMessage = "Age must be between 0 and 100")]
public int Age { get; set; }

Regular expression attribute

The RegularExpressionAttribute class is used to specify that a property value must match a specified regular expression. The DataForm component displays an error message if the property value does not match the specified regular expression.

[RegularExpression(@"^[a-zA-Z]+$", ErrorMessage = "Name must contain only alphabets")]
public string Name { get; set; }

String length Attribute

The StringLengthAttribute class is used to specify the minimum and maximum length constraints for the value of a property. The DataForm component displays an error message if the property value is not within the specified length constraints.

[StringLength(100, MinimumLength = 3, ErrorMessage = "Name must be between 5 and 10 characters")]
 public string Name { get; set; }

Minimum length Attribute

The MinLengthAttribute class is used to specify the minimum length constraints for the value of a property. The DataForm component displays an error message if the property value is not within the specified length constraints.

[MinLength(3, ErrorMessage = "Name must be at least 3 characters")]
public string Name { get; set; }

Maximum length Attribute

The MaxLengthAttribute class is used to specify the maximum length constraints for the value of a property. The DataForm component displays an error message if the property value is not within the specified length constraints.

[MaxLength(10, ErrorMessage = "Name must be at most 10 characters")]
public string Name { get; set; }

Phone number attribute

The PhoneAttribute class is used to specify that a property value must match a specified phone number pattern. The DataForm component displays an error message if the property value does not match the specified phone number pattern.

[Phone(ErrorMessage = "Phone number is not valid")]
public string PhoneNumber { get; set; }

Email address attribute

The EmailAddressAttribute class is used to specify that a property value must match a specified email address pattern. The DataForm component displays an error message if the property value does not match the specified email address pattern.

[EmailAddress(ErrorMessage = "Email address is not valid")]
public string Email { get; set; }

URL attribute

The UrlAttribute class is used to specify that a property value must match a specified URL pattern. The DataForm component displays an error message if the property value does not match the specified URL pattern.

[Url(ErrorMessage = "URL is not valid")]
public string Url { get; set; }

Enum data type attribute

The EnumDataTypeAttribute class is used to specify that a property value must be a member of the specified enumeration. The DataForm component displays an error message if the property value is not a member of the specified enumeration.

[EnumDataType(typeof(Gender), ErrorMessage = "Please enter a valid gender")]
 public string Gender { get; set; }

Compare attribute

The CompareAttribute class is used to specify that a property value must match the value of another property in the same class. The DataForm component displays an error message if the property value does not match the value of the other property.

[Compare("Password", ErrorMessage = "Passwords do not match")]
public string ConfirmPassword { get; set; }

Editable attribute

The EditableAttribute class is used to specify that a property can be edited in the DataForm component.

[Editable(false)]
public string ID { get; set; }

Custom validation

A custom validation attribute in .NET is a class that inherits from the ValidationAttribute abstract class and overrides the IsValid method. This method is called when the attribute is applied to a property and the property’s value is being validated.

In the IsValid method, you can define your custom validation logic. If the validation fails, you return a ValidationResult object with an error message. If the validation passes, you return ValidationResult.Success.

@using System;
@using System.ComponentModel.DataAnnotations;
@using Syncfusion.Blazor.DataForm;
@using System.Text.RegularExpressions;

<SfDataForm ID="MyForm"
            Model="@EmployeeModel"
            Width="50%">
    <FormValidator>
        <DataAnnotationsValidator></DataAnnotationsValidator>
    </FormValidator>
    <FormItems>
        <FormGroup LabelText="Sign Up Details">
            <FormItem Field="@nameof(EmployeeModel.Name)" LabelText="Name"></FormItem>
            <FormItem Field="@nameof(EmployeeModel.Email)" LabelText="Email Id"></FormItem>
            <FormItem Field="@nameof(EmployeeModel.Password)" LabelText="Password" EditorType="FormEditorType.Password"> </FormItem>
            <FormItem Field="@nameof(EmployeeModel.ConfirmPassword)" LabelText="Confirm Password" EditorType="FormEditorType.Password"> </FormItem>
        </FormGroup>
    </FormItems>
</SfDataForm>


@code {
    private EmployeeDetails EmployeeModel = new EmployeeDetails();

    public class EmployeeDetails
    {
        [Required]
        public string? Name { get; set; }

        [Required]
        [PasswordValidation(ErrorMessage = "This field should not be Empty")]
        public string? Password { get; set; }

        [Required]
        [Compare("Password", ErrorMessage = "Confirm Password must match Password")]
        public string? ConfirmPassword { get; set; }

        [Required]
        [EmailValidation(ErrorMessage = "This field should not be Empty")]
        public string? Email { get; set; }
    }

    public class PasswordValidationAttribute : ValidationAttribute
    {
        protected override ValidationResult IsValid(object value, ValidationContext validationContext)
        {
            string fieldValue = value as string;

            if (fieldValue.Length < 10)
            {
                return new ValidationResult("Password should have at least 10 characters", new[] { validationContext.MemberName });
            }

            if (!Regex.IsMatch(fieldValue, @"[A-Z]"))
            {
                return new ValidationResult("Password should contain at least one uppercase letter", new[] { validationContext.MemberName });
            }

            if (!Regex.IsMatch(fieldValue, @"[a-z]"))
            {
                return new ValidationResult("Password should contain at least one lowercase letter", new[] { validationContext.MemberName });
            }

            if (!Regex.IsMatch(fieldValue, @"[@#$%^&+=]"))
            {
                return new ValidationResult("Password should contain at least one special character", new[] { validationContext.MemberName });
            }

            return ValidationResult.Success;
        }
    }

    public class EmailValidationAttribute : ValidationAttribute
    {
        protected override ValidationResult IsValid(object value, ValidationContext validationContext)
        {
            string email = value as string;

            if (!IsValidEmail(email))
            {
                return new ValidationResult("Email address is not valid..", new[] { validationContext.MemberName });
            }

            return ValidationResult.Success;
        }

        private bool IsValidEmail(string email)
        {
            return Regex.IsMatch(email, @"^[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}$");
        }
    }
}

In the above example, In the PasswordValidationAttribute class, the IsValid method checks if the password meets certain criteria (length, contains uppercase letter, contains lowercase letter, contains special character). If it doesn’t, it returns a ValidationResult with an appropriate error message.In the EmailValidationAttribute class, the IsValid method checks if the email is in a valid format. If it’s not, it returns a ValidationResult with an error message.

Blazor DataForm Custom Validation