Blazor EditForm with 'novalidate' no longer completely suppresses builtin browser validation in v5 RC4

[brduncan-shoprite]

This is something I ran into whilte evaluating the recently released RC4. Perhaps a bug or perhaps an oversight on my end.

A FluentTextInput with Required="true" will trigger a browser validation popup when the field is cleared and the value is committed using enter or tabbing away.

This can be demonstrated on the Form example on the v5 demo site by typing a value into Identifier, tabbing away, tabbing back, clearing the field, then tabbing away again.

"novalidate" still suppresses browser validation from a form submit action, it only the field level validation seems to be affected.

[Vincent Baaij (vnbaaij)]

That is native browser validation which gets triggered by the :user-invalid state. I don't think there is anything we can do about that.

[Vincent Baaij (vnbaaij)]

Yes, it didn't exist in RC3 because we didn't have the FluentValidationMessage yet 😁

But it is like you say: "even if the form has novalidate set, and if the field has formnovalidate set." I don't think we want to overrule the browser implementation there.

[brduncan-shoprite]

Thanks, I understand.

I managed to achieve the behaviour I was after by instead removing Required from the FluentTextInput and replacing the Label text property with a LabelTemplate element and letting the DataAnnotationsValidator handle any required checks along with other validations.

<FluentTextInput @bind-Value="@modelInstance.Name">
    <LabelTemplate>
        <FluentLabel Required>Name</FluentLabel>
    </LabelTemplate>
</FluentTextInput>

Is there a more straightforward method to apply an asterisk to a required field's label without opting in to the browser validation that I may be missing? 😅

[Vincent Baaij (vnbaaij)]

I'm researching if (and how) we could offer an opt-out of the reportValidity

[Vincent Baaij (vnbaaij)]

Okay, I was able to make it opt-in.

See #4989

[brduncan-shoprite]

That's awesome, thank you so much.