We have two buttons inside of an Editform. They do a bit of different things. But we want the Data annotation validation to work on both button click. The first button is easy, it triggers the OnValidSubmit. But the second button, although it triggers page validation, still writes to console.

Below is the class used:

using System.ComponentModel.DataAnnotations;

namespace MyApp.Client.Models
{
    public class TestModel
    {
        [Required]
        public string MyName { get; set; }
    }
}

Below is the razor component which includes two buttons and one inputtext field:

@page "/test"

<h3>test</h3>

<EditForm Model="model" OnValidSubmit="PostAsync" >

    <DataAnnotationsValidator></DataAnnotationsValidator>
    <ValidationSummary></ValidationSummary>

    <div >

    <div >
        <div >
            <div >
                <button type="submit" >Save</button>
            </div>
            <div >
                <button type="submit"  @onclick="(async ()=>await SaveAndGoToListAsync())">Save &amp; Go To List</button>
            </div>

        </div>
    </div>

    <div >
        <label for="MyName" >My Name:</label>
        <InputText id="MyName"  @bind-Value="model.MyName"></InputText>
        <ValidationMessage For="@(()=>model.MyName)"></ValidationMessage>
    </div>

    </div>
</EditForm>

@code {
    private TestModel model;
public Test()
{
    model = new();
}

private void PostAsync()
{
    Console.WriteLine("PostAsync");
}

private async Task SaveAndGoToListAsync()
{
    Console.WriteLine("SaveAndGoToListAsync");    
}
}

CodePudding user response：

This is because the second button has an onclick method.

@onclick="(async ()=>await SaveAndGoToListAsync())"

Here, instead of OnValidSubmit, you should use Context and Anonymous Functions, you can call the methods related to onclicks and pass the formContext to them. For validation, you can check the validity of the form for the corresponding method using Context.Validate in the corresponding method.

@page "/test"

<h3>test</h3>

<EditForm Model="model" Context="formContext" >

    <DataAnnotationsValidator></DataAnnotationsValidator>
    <ValidationSummary></ValidationSummary>

    <div >

        <div >
            <div >
                <div >
                    <button type="submit"  @onclick="(()=>PostAsync(formContext))">Save</button>
                </div>
                <div >
                    <button type="submit"  @onclick="(async ()=>await SaveAndGoToListAsync(formContext))">Save &amp; Go To List</button>
                </div>

            </div>
        </div>

        <div >
            <label for="MyName" >My Name:</label>
            <InputText id="MyName"  @bind-Value="model.MyName"></InputText>
            <ValidationMessage For="@(()=>model.MyName)"></ValidationMessage>
        </div>

    </div>
</EditForm>

@code {
    private TestModel model;
    public Test()
    {
        model = new();
    }

    private void PostAsync(EditContext formContext)
    {
        bool formIsValid = formContext.Validate();
        if (formIsValid == false)
            return;

        Console.WriteLine("PostAsync");
    }

    private async Task SaveAndGoToListAsync(EditContext formContext)
    {
        bool formIsValid = formContext.Validate();
        if (formIsValid == false)
            return;

        Console.WriteLine("SaveAndGoToListAsync");    
    }
}