Aspnetcore: Async validation is not updating the field class of inputs after a delay on Blazor

Created on 5 Jul 2019  路  3Comments  路  Source: dotnet/aspnetcore

Describe the bug

When using async validation, the field class of inputs is not updated if the validation returns after a delay.
Using .Net Core 3.0 Preview 6

To Reproduce

  1. Clone the repo at https://github.com/AndrewGriffithsFG/FluentValidation/tree/master
  2. Run one of the sample projects (both exhibit the same behaviour)
  3. Click the Save button without filling in any information
  4. The correct validation messages are displayed, but the inputs do not reflect their validation status

image

Expected behavior

The field class of all 3 inputs to be invalid and the border colour to be red.

Additionally, removing the Task.Delay(100) from the PersonValidator causes the inputs to display as expected.

On investigation, the InputBase is not handling EditContext.OnValidationStateChanged.
Adding EditContext.OnValidationStateChanged += (sender, eventArgs) => StateHasChanged(); to SetParametersAsync() will cause the field class of the inputs to be updated and the border to be set correctly.
(Disposal and cleanup code omitted for brevity)

The ValidationMessage component does handle this event which is why the validation message is displayed correctly even after a delay.
https://github.com/aspnet/AspNetCore/blob/1b6f721648a500f59eda475564238e787a1967d8/src/Components/Components/src/Forms/ValidationMessage.cs#L65

Done area-blazor bug

Most helpful comment

All 3 comments

Thanks for contacting us, @AndrewGriffithsFG.
We'll try to get to this before 3.0 release, but can't commit, given all the other critical work on our plate.

Just experienced this myself. UI is misleading when using async validation to call server APIs.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

danroth27 picture danroth27  路  79Comments

KerolosMalak picture KerolosMalak  路  269Comments

mkArtakMSFT picture mkArtakMSFT  路  89Comments

natemcmaster picture natemcmaster  路  213Comments

rmarinho picture rmarinho  路  78Comments