我有一个带有表单的剃须刀页面，这个页面附加到模型上。 在“提交”时，我尝试在服务器端验证一些数据，如果失败则显示“toast”。
问题是表单正在“刷新”页面，它似乎导航到他自己！ 因此，由于这种“刷新”，我无法在 toast 中显示我的错误。
index.cshtml
@model TestModel
<form method="post">
<button type="submit">GO</button>
</form>
TestModel.cs
public virtual async Task<IActionResult> OnPostAsync()
{
_toaster.ShowError("Hellow world", "I got an issue");
return Page();
}
有什么办法解决这个问题吗？
【问题讨论】：
标签： asp.net asp.net-core razor
您应该删除 Blazor 标记。您的问题是 Razor 页面，而不是 Blazor。
您是否看到其他答案中的代码。您应该执行与 Blazor 中的 EditForm 类似的操作。一般来说，您应该使用 JavaScript Fetch API 与服务器通信，而不是传统的方式提交您的表单，其结果是页面完全刷新。我推荐过 使用 Fetch API 也是因为 Blazor 使用它与服务器上的 API 端点进行通信。但是您可以改用 jQuery……但是，我不推荐它。我确实希望您现在已经意识到应该使用 AJAX，对吧？
顺便说一下，您可以创建实现此类功能的 Blazor 组件， 并将它们包含在您的 Razor 页面中。
我认为 chris sainty 在 Blazor 中建立了一个 toast 库。它可能会帮助你。 我还认为我看到了 Daniel Wroth 的推送通知示例，在 Blazor 中创建 PWA 时进行了演示。
希望对你有帮助……
【讨论】：
如果您移动了验证客户端，您可以使用 EditForm 并使用 DataAnnotationsValidator，例如；
<EditForm Model="@CurrentObject" OnValidSubmit="@HandleValidSubmit">
<DataAnnotationsValidator />
<div class="form-group">
<label for="Name">Name</label>
<InputText id="Name" class="form-control" @bind-Value="@CurrentObject.Name" />
<ValidationMessage For="@(() => CurrentObject.Name)" />
</div>
<button type="submit" class="btn btn-primary">Submit</button>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
</EditForm>
HandleValidSubmit 将是您的实际提交（创建/更新等），@CurrentObject 将是您的模型类的一个实例，而该实例又将使用来自 System.ComponentModel.DataAnnotations 命名空间的属性进行丰富，例如；
using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Threading.Tasks;
namespace [YourNamespace].Data.Model
{
public class ExampleModel
{
// holds the front-end name for the record
[Required(ErrorMessage = "Name is required")]
public string Name { get; set; } = "";
}
}
如果您想保留验证服务器端，您仍然可以使用 EditForms，并使用“HandleSubmit”方法代替，详见此处； https://docs.microsoft.com/en-us/aspnet/core/blazor/forms-validation?view=aspnetcore-3.1
【讨论】：