MVC3 Razor JQuery客户端validation带有一个额外的警告框

我被要求创建一个登录表单，当用户输入未通过validation时，它会弹出一个警告框。

我使用基于模型的validation连接所有内容。

例如：

public class LogonViewModel { [Required( ErrorMessage = "User Name is Required")] public string UserName { get; set; } [Required( ErrorMessage = "Password is required")] public string Password { get; set; } } 

我在页面上有一个validation摘要：

 Html.ValidationSummary() 

我希望摘要在页面上，以防用户关闭javascript。 但是，如果客户端validation触发，我还想捕获validation事件并将错误放入警报框，就像我被问到的那样。

我的表格基本上是……

 @Html.ValidationSummary() @using (Html.BeginForm(null, null, FormMethod.Post, new { id = "loginForm" })) { username: @Html.TextBoxFor(m => m.UserName) 
 password: @Html.TextBoxFor(m => m.Password) 
  } 

我试过的其中一件事是

  $(document).ready(function () { $("#loginForm").validate({ invalidHandler: function (form, validator) { var errors = validator.numberOfInvalids(); if (errors) { alert(errors); } } }); });  

我无法弄清楚如何使这项工作。 我只是想允许正常validation并显示错误，但有机会再做一点。

Answer 1

一种解决方案是修改jquery.validate.unobtrusive.js中的onErrors函数。 该function非常易读。

Answer 2

经过多次搜索：

我在jQueryvalidation器初始化之后发现了这个Add InvalidHandler这引出了我的解决方案：

  $(document).ready(function () { $("#loginForm").bind('invalid-form.validate', function (form, validator) { var errors = "Login failed:\r\n"; for (var i = 0; i < validator.errorList.length; i++) { errors = errors + "\r\n\t-" + validator.errorList[i].message; } alert(errors); } ); }); 

这将运行正常validation并更新validation摘要并设置所有样式，然后允许我做后续的额外事情。

Answer 3

这对我有用……

 var settings = $.data($('form')[0], 'validator').settings; if (jQuery.validator) { jQuery.validator.setDefaults({ showErrors: function (errorMap, errorList) { $.extend($.validator.defaults, settings); var message = ''; for (var i = 0; i < errorList.length; i++) { message += errorList[i].message + '\n\n'; } alert(message);//Replace your modal popup here } }); }