即使提交失败,ASP.NET Core Unobtrusive客户端验证表单onsubmit也会触发

时间:2018-12-26 16:28:23

标签: c# jquery asp.net asp.net-core unobtrusive-validation

注意:这与.NET Core v2.0有关。您可能会找到相关的帖子,但它们不能解决我面临的问题。

我正在使用以下代码进行Unobtrusive Client side验证:

JSON data.Domains: [{"North America (NAM)":"NAM"},{"Europe (EUR)":"EUR"},{"Australia (AUS)":"AUS"},{"Latin America (LAAM)":"LAAM"},{"Asia (APA)":"APA"}]

好事是它正在客户端进行验证。

但是,即使验证失败,也会触发<form asp-route-returnurl="@ViewData["ReturnUrl"]" method="post" onsubmit="showPleaseWait()" > <div asp-validation-summary="All" class="text-danger"></div> <div class="form-group"> <label asp-for="Username" class="control-label"></label> <input asp-for="Username" class="form-control" placeholder="Username" /> <span asp-validation-for="Username" class="text-danger"></span> </div> <div class="form-group"> <label asp-for="Password" class="control-label"></label> <input asp-for="Password" value="" class="form-control" placeholder="Password" /> <span asp-validation-for="Password" class="text-danger"></span> </div> <div class="form-group"> <button type="submit" class="btn btn-success btn-lg" style="margin:auto;display:block">Log in</button> </div> </form> 事件。结果,我的form.onsubmit方法被调用了。我认为不应该调用它,因为由于验证失败而尚未提交表单。

下面是模型:

showPleaseWait

任何解决方案或解决方法都将受到高度赞赏。

1 个答案:

答案 0 :(得分:3)

jQuery Unobtrusive Validation和更高级别的jQuery Validation插件不会阻止引发提交事件,正如您已经注意到的,这意味着只要用户尝试,您的showPleaseWait()函数就会被调用提交表单。

进行此工作的一种方法是在尝试运行自己的代码之前,从showPleaseWait函数中查询验证状态。这是一个示例:

function showPleaseWait() {
    if ($("form").valid()) {
        // Your code here.
    }
}

此实现利用jQuery验证的valid函数的优势,

  

检查所选表单是否有效或所有所选元素是否有效。

我刚刚在上面使用了一个简单的$("form")选择器,但是如果您在一个页面上有多个表单,则可能需要更具体的选择器。