在 Blazor 中,通过 DataAnnotation 验证 InputText 后执行方法

问题描述

我需要检查输入文本中键入的数据是否有效,如果有效,则执行一个方法。 (由 DataAnnotation 验证)。

我在 OnFieldChangedEditForm 事件中尝试过,但该事件在验证之前执行。

我怎么能这样做?

解决方法

EditForm 中的参数 OnValidSubmit 可以做到这一点。下面是一个例子:

MyModel.cs

using System;
using System.ComponentModel.DataAnnotations;

public class MyModel
{
    [Required]
    public string Field1 { get; set; }
    [Required,Range(1,10)]
    public int Fields2 { get; set; } = 1;
}

MyPage.razor

<EditForm Model="@exampleModel" OnValidSubmit="@HandleValidSubmit">
    <DataAnnotationsValidator />
    <ValidationSummary />

    <InputText id="field1" @bind-Value="@exampleModel.Field1"></InputText>
    <button type="submit">Submit</button>
</EditForm>

<h5 hidden="@(!isFormValid)">Form submitted successfully!</h5>

@code {
    MyModel exampleModel = new MyModel();
    bool isFormValid = false;

    void HandleValidSubmit()
    {
        isFormValid = true;
        StateHasChanged();
    }
}

无效提交:

enter image description here

有效提交:

enter image description here