Ask Your Question

Revision history [back]

click to hide/show revision 1
initial version

Fluent Validation can be used to validate nested components in MudBlazor by creating separate validator classes for the nested components and adding them to the parent component's validator.

To do so, follow these steps:

  1. Create separate validator classes for each nested component. For example, if you have a form with a nested component for personal information, you can create a separate validator class for the personal information component.

Example:

```# public class PersonalInfoValidator : AbstractValidator<personalinfomodel> { public PersonalInfoValidator() { RuleFor(x => x.FirstName).NotEmpty().WithMessage("First name is required"); RuleFor(x => x.LastName).NotEmpty().WithMessage("Last name is required"); } }


2. In the parent component's validator class, create a property for each nested component's validator and initialize it in the constructor.

Example:

```#
public class MyFormValidator : AbstractValidator<MyFormModel>
{
    public PersonalInfoValidator PersonalInfoValidator { get; }

    public MyFormValidator(PersonalInfoValidator personalInfoValidator)
    {
        PersonalInfoValidator = personalInfoValidator;

        RuleFor(x => x.Email).NotEmpty().EmailAddress().WithMessage("Email is required");
        RuleFor(x => x.PersonalInfo).SetValidator(PersonalInfoValidator);
    }
}
  1. In the parent component, inject the nested component's validator and add it to the parent component's validator.

Example:

```# [Inject] public PersonalInfoValidator PersonalInfoValidator { get; set; }

private readonly MyFormValidator _validator;

public MyForm() { _validator = new MyFormValidator(PersonalInfoValidator); }


4. Use the parent component's validator to validate the entire form, including the nested components.

Example:

```#
private async Task SubmitFormAsync()
{
    var validationResult = await _validator.ValidateAsync(FormModel);

    if (validationResult.IsValid)
    {
        // form is valid, proceed with submission
    }
}