Custom Validation Messages Not Displaying for Nested Object Models in Blazor EditForm

[UdhayaKumarDuraisamy]

Is there an existing issue for this?

• I have searched the existing issues

Describe the bug

I am experiencing an issue with custom validation in a Blazor EditForm when using a nested object model. While the ValidationSummary displays errors correctly, the ValidationMessage components for nested properties do not show the validation errors as expected.

Code Snippet:

@using System.ComponentModel.DataAnnotations

<h3>Location Maintenance</h3>

<div class="mt-4" style="margin: 0 auto;">
    <EditForm Model="@LocationMaintenance" Width="50%">

        <ObjectGraphDataAnnotationsValidator></ObjectGraphDataAnnotationsValidator>
        <ValidationSummary></ValidationSummary>

        <InputText @bind-Value="@LocationMaintenance.LocationType"></InputText>
        <ValidationMessage For="@(() => LocationMaintenance.LocationType)" />
        <InputText @bind-Value="@LocationMaintenance.PhysicalAddressModel.AddressType"></InputText>
        <ValidationMessage For="@(() => LocationMaintenance.PhysicalAddressModel.AddressType)" />
        <button type="submit">Submit</button>
    </EditForm>
</div>

@code {
    public LocationMaintenanceModel LocationMaintenance { get; set; } = new LocationMaintenanceModel();

    public class LocationMaintenanceModel : AddressModel
    {

        [RequiredWithMessage("LocationTypeRequired")]
        public string? LocationType { get; set; }

        [ValidateComplexType]
        public AddressModel PhysicalAddressModel { get; set; } = new() { AddressType = string.Empty };
    }

    public class RequiredWithMessageAttribute : ValidationAttribute
    {
        private readonly string _errorMessageKey;

        public RequiredWithMessageAttribute(string errorMessageKey)
        {
            _errorMessageKey = errorMessageKey;
        }

        protected override ValidationResult IsValid(object? value, ValidationContext validationContext)
        {
            if (value == null || string.IsNullOrWhiteSpace(value.ToString()))
            {
                string labelKeyName = $"lbl{validationContext.MemberName}";
                string errorMessage = _errorMessageKey;
                return new ValidationResult(errorMessage, new[] { validationContext.MemberName });
            }

            return ValidationResult.Success!;
        }
    }

    public class AddressRequiredWithMessageAttribute : ValidationAttribute
    {
        private readonly string _errorMessageKey;

        public AddressRequiredWithMessageAttribute(string errorMessageKey)
        {
            _errorMessageKey = errorMessageKey;
        }

        protected override ValidationResult IsValid(object? value, ValidationContext validationContext)
        {
            if (value == null || string.IsNullOrWhiteSpace(value.ToString()))
            {
                return new ValidationResult(_errorMessageKey);
            }

            return ValidationResult.Success!;
        }
    }


    public class AddressModel
    {
        [AddressRequiredWithMessage("Address Required")]
        public string? AddressType { get; set; }

        [AddressRequiredWithMessage("City Required")]
        public string? City { get; set; }

        public string? State { get; set; }

        public string? PostalCode { get; set; }
    }
}

Expected Behavior

Validation messages should be displayed for all properties, including those in nested objects, alongside the ValidationSummary.

Actual Behavior:
Validation messages for nested properties do not appear, even though the ValidationSummary lists the errors.

Steps To Reproduce

1. Create a Blazor component using an EditForm with a model that includes nested objects.
2. Implement custom validation attributes for properties within the nested object.
3. Attempt to submit the form with invalid data for the nested properties.

Exceptions (if any)

No response

.NET Version

DotNET 8

Anything else?

No response

[mkArtakMSFT]

Thanks for contacting us. The ValidateComplexType attribute comes from an experimental package that isn't supported. We don't know if that's the cause of the issue here or something else, so for now we'll keep this issue for investigation.

[mkArtakMSFT]

@UdhayaKumarDuraisamy does this work if you use built-in validation attributes instead of the custom ones that you've defined?

[UdhayaKumarDuraisamy]

If the Required attribute is applied to Nested Object Models in a Blazor EditForm, the validation summary may appear twice for the Nested Object Models. Additionally, even after validation succeeds, the validation summary might still be displayed. However, the success class is correctly applied to the InputText component, and the validation message is properly removed as expected.

For better understanding, please refer to the provided GIF illustration and code snippet below:

[GIF Illustration Here]

[Code Snippet!]

@using System.ComponentModel.DataAnnotations

<h3>Location Maintenance</h3>

<div class="mt-4" style="margin: 0 auto;">
    <EditForm Model="@LocationMaintenance" Width="50%">

        <ObjectGraphDataAnnotationsValidator></ObjectGraphDataAnnotationsValidator>
        <ValidationSummary />

        <InputText @bind-Value="@LocationMaintenance.LocationType"></InputText>
        <ValidationMessage For="@(() => LocationMaintenance.LocationType)" />

        <InputText @bind-Value="@LocationMaintenance.PhysicalAddressModel.State"></InputText>
        <ValidationMessage For="@(() => LocationMaintenance.PhysicalAddressModel.State)" />

        <button type="submit">Submit</button>
    </EditForm>
</div>

@code {
    public LocationMaintenanceModel LocationMaintenance { get; set; } = new LocationMaintenanceModel();

    public class LocationMaintenanceModel : AddressModel
    {

        [Required]
        public string? LocationType { get; set; }

        [ValidateComplexType]
        public AddressModel PhysicalAddressModel { get; set; } = new() { State = string.Empty};
    }

    public class AddressModel
    {
        [Required]
        public string? State { get; set; }

        public string? PostalCode { get; set; }
    }
}