Estou usando o Blazorise com um aplicativo Blazor do lado do servidor. Quando tento agrupar os componentes de entrada do Blazorise em meus componentes personalizados, as mensagens de validação param de funcionar.
Com isso quero dizer que quando clico em enviar não vejo nenhuma mensagem de erro nos campos com valores inválidos. Se eu não agrupar as entradas do Blazorise e clicar em enviar, vejo mensagens de erro.
Aqui está um exemplo. Este formulário contém o mesmo campo duas vezes. Um embrulhado dentro do meu componente personalizado TextField
e o outro desembrulhado.
<Form>
<Validations @ref="@fluentValidations" Mode="ValidationMode.Manual" Model="AccountDto" HandlerType="typeof(FluentValidationHandler)">
<TextField Label="Name" @bind-Text="@Account.Name" />
<Validation>
<Field>
<FieldLabel For="account-name-input">Name</FieldLabel>
<TextEdit ElementId="account-name-input" @bind-Text="@Account.Name">
<Feedback>
<ValidationError />
</Feedback>
</TextEdit>
</Field>
</Validation>
</Validations>
<Field>
<Button Type="ButtonType.Submit"
PreventDefaultOnSubmit
Clicked="Submit">
Submit
</Button>
</Field>
</Form>
O código por trás contém o seguinte para o formulário (deixei de fora muitas informações):
private Validations fluentValidations = null!;
private async Task Submit()
{
if (await fluentValidations.ValidateAll())
await CreateAccount(Account);
}
O componente personalizado se parece. (O código por trás do arquivo não contém nada de interessante):
<Validation>
<Field>
<FieldLabel For="@GetInputId()">
@Label
</FieldLabel>
<TextEdit ElementId="@GetInputId()"
Text="@Text"
TextChanged="TextChanged"
Disabled="@Disabled">
<Feedback>
<ValidationError />
</Feedback>
</TextEdit>
</Field>
</Validation>
Eu sei que a validação funciona corretamente porque o erro aparece no componente desembrulhado, mas não no meu componente.