验证后链接到其他页面

问题描述

您好，我想问一下是否可以提交验证并链接到 BLAZOR 中的其他页面 那就是我如何将取消链接链接到其他页面

 <NavLink href="@($"/personal/list/1")">
       <button class="btn btn-primary" @onclick="CloseModal">@Loc["cancel"]</button>
 </NavLink>

那是我的提交按钮

 <button type="submit" class="btn btn-success">@Loc["save"]</button>

多数民众赞成在其中的按钮的编辑模型

<EditForm Model="PersModel" OnValidSubmit="@CreatePersonal">
<FluentValidator TValidator="PersonalViewModelValidator" />

多数民众赞成在有效连接到API的连接

  protected async Task CreatePersonal()
{
    var token = Storage["JWT-Token"];
    bool personalExist = false;
    Http.DefaultRequestHeaders.Authorization = new AuthenticationHeaderValue("Bearer",token);

    //Convert Selected values into the Pers database values
    PersModel.Pers.Group = PersModel.SelectedGruppe?.Name;
    PersModel.Pers.Anrede = PersModel.SelectedAnredeName;
    PersModel.Pers.Grad = PersModel.SelectedGradName;
    PersModel.Pers.Titel = PersModel.SelectedTitelName;
    PersModel.Pers.Department = PersModel.SelectedAbteilungName;
    PersModel.Pers.Group = PersModel.SelectedGruppeName;
    PersModel.Pers.PrevDepartment = PersModel.SelectedPrevAbteilungName;
    PersModel.Pers.PrevGroup = PersModel.SelectedPrevGruppeName;
    PersModel.Pers.Uni = PersModel.SelectedStaetteName;
    //on input select after editing the --Select-- is converted into value


    try
    {
        BoolValue uh = await Http.GetFromJsonAsync<BoolValue>(Storage["environment_uri"] + "/personal/exists/" + PersModel.Pers.PersName);
        personalExist = uh.Value;
    }
    catch (Exception ex)
    {
        Logger.LogWarning(ex,"Failed to load  BoolValue uh");
        Storage.SetItem("Transaction","errorload");
    }


    if (personalExist == false && PersModel.Pers.PersName != "_add_")
    {
        await Http.PostAsJsonAsync(Storage.GetItem("environment_uri") + "/personal",PersModel.Pers); // thats the one i add here

        Storage.SetItem("Transaction","modified");
        await OnParametersSetAsync();
        CloseModal();

    }
    else if (isEdit == true)
    {
        // here was post in original
        await Http.PutAsJsonAsync(Storage.GetItem("environment_uri") + "/personal",PersModel.Pers); // this update
        CloseModal();
        Storage.SetItem("Transaction","modified");
        await OnParametersSetAsync();
    }
    else if (isEdit == false && personalExist == true)
    {

        Storage.SetItem("Transaction","errorsame");
        await OnParametersSetAsync();

    }


}

那是Validation类

 public PersonalViewModelValidator()
    {
        CascadeMode = CascadeMode.StopOnFirstFailure;

        RuleFor(data => data.Pers.PersName).NotEmpty().WithMessage("is a required field.");
        RuleFor(data => data.Pers.Bezeichnung).NotEmpty().WithMessage("is a required field.");
        RuleFor(data => data.Pers.Id).NotEmpty().WithMessage("is a required field.");
        RuleFor(data => data.Pers.Street).NotEmpty().WithMessage("is a required field.");
        RuleFor(data => data.Pers.HouseNumber).NotEmpty().WithMessage("is a required field.");
        RuleFor(data => data.Pers.PLZ).NotEmpty().WithMessage("is a required field.");
        RuleFor(data => data.Pers.Location).NotEmpty().WithMessage("is a required field.");
        RuleFor(data => data.Pers.DateHired).NotEmpty().WithMessage("is a required field.");
        RuleFor(data => data.Pers.FullTime).NotEmpty().WithMessage("is a required field.");
        RuleFor(data => data.Pers.Email).EmailAddress().WithMessage("A valid email address is required.");

        //rule for the sieze max
        RuleFor(data => data.Pers.Comment_1).Length(0,40).WithMessage("Must be less than 40 characters");
        RuleFor(data => data.Pers.Comment_2).Length(0,40).WithMessage("Must be less than 40 characters");

        // not working
        RuleFor(data => data.SelectedAbteilungName).NotEmpty().WithMessage("is a required field.");
        RuleFor(data => data.SelectedGruppeName).NotNull().WithMessage("is a required field.");

        //RuleFor(data => data.SelectedAbteilung).NotEmpty().WithMessage("Abteilung  is a required field.");
        //RuleFor(data => data.SelectedGruppe).NotNull().WithMessage("Test test");
    }

那么，如果存在验证错误等，提交所有这些信息将得到反馈，例如，链接到另一个页面并从Toaster获取消息

NavLink href="@($"/personal/list/1")


@if (Storage.GetItem("Transaction") == "modified")

{

Toaster.Success(@TLoc["success1"],@TLoc["success2"]);
Storage.RemoveItem("Transaction");

}

解决方法

我找到了解决方案

   [Inject]
public NavigationManager NavigationManager { get; set; }

  protected void NavigateToOverview()
{
    NavigationManager.NavigateTo("/personal/list/1");
}

然后您只需在API结果之后调用此方法

 NavigateToOverview();

在我的情况下是

  else if (isEdit == true)
{
    // here was post in original
    await Http.PutAsJsonAsync(Storage.GetItem("environment_uri") + "/personal",PersModel.Pers); // this update
    CloseModal();
    Storage.SetItem("Transaction","modified");
    await OnParametersSetAsync();
   NavigateToOverview();
}