Question

我有一个ASP.NET Core 2.0项目，我在其中使用表单标记进行提交。现在我想在表单提交上添加一些客户端验证。所以我在表单上使用onsubmit标记，如下所示：

<form id="formId" asp-action="ActionName" onsubmit="validationFunction(Event)">

我有这样的功能：

function validationFunction(e) {
    //CheckStuff
    e.preventDefault();
}

现在，当我提交表单时，该功能会被正确触发，但e.preventDefault()不会停止提交。 return false也没有。

如何阻止我的提交完成？

PS。我知道我可以通过单击按钮来处理这个案例，并在完成验证时提交我的表单，但我想知道为什么不在ASP.NET Core中进行上述工作或者我缺少什么？

Answer 1

应返回onsubmit属性并return false以阻止提交。

<form id="formId" asp-action="ActionName" onsubmit="return validationFunction(Event)">

Answer 2

如果你想这样做“正确”，最简单的方法是在前面的课程中设置验证：

public class Movie
{
public int ID { get; set; }

[StringLength(60, MinimumLength = 3)]
[Required]
public string Title { get; set; }

[Display(Name = "Release Date")]
[DataType(DataType.Date)]
public DateTime ReleaseDate { get; set; }

[Range(1, 100)]
[DataType(DataType.Currency)]
public decimal Price { get; set; }

[RegularExpression(@"^[A-Z]+[a-zA-Z''-'\s]*$")]
[Required]
[StringLength(30)]
public string Genre { get; set; }

[RegularExpression(@"^[A-Z]+[a-zA-Z''-'\s]*$")]
[StringLength(5)]
[Required]
public string Rating { get; set; }
}

https://docs.microsoft.com/en-us/aspnet/core/tutorials/first-mvc-app/validation

或JavaScript 甚至HTML

带有表单标记的ASP.NET Core - 验证表单onsubmit并阻止提交

2 个答案: