Jquery ASP MVC4使用正则表达式进行的不引人注目的验证不会将焦点设置在无效字段上
简化的情况是,我有一个带有两个字段的表单,一个是邮政编码,另一个是电子邮件地址 它们由包含以下内容的编辑模型支持:Jquery ASP MVC4使用正则表达式进行的不引人注目的验证不会将焦点设置在无效字段上,jquery,asp.net-mvc-4,unobtrusive-validation,Jquery,Asp.net Mvc 4,Unobtrusive Validation,简化的情况是,我有一个带有两个字段的表单,一个是邮政编码,另一个是电子邮件地址 它们由包含以下内容的编辑模型支持: [Required(ErrorMessage = "Mandatory")] [Range(10000, 99999, ErrorMessage = "Error bla bla...")] public string ZipCode{ get; set; } [Required(ErrorMessage = "Mandatory", AllowEmptyStrings = fa
[Required(ErrorMessage = "Mandatory")]
[Range(10000, 99999, ErrorMessage = "Error bla bla...")]
public string ZipCode{ get; set; }
[Required(ErrorMessage = "Mandatory", AllowEmptyStrings = false)]
[StringLength(64, ErrorMessage = "Error bla bla")]
[RegularExpression(EmailRegEx, ErrorMessage = "Error bla bla")] //EmailRegEx is a const string
public string ContactEmail { get; set; }
问题出在这里。当在单击“提交”按钮后启动验证,并且在“邮政编码”字段中发现错误时,会将焦点设置在无效字段上。
但是,当带有正则表达式的电子邮件失败时,焦点仍然是submit按钮。
这是在Chrome31和Win7中测试的
我正在使用jQuery验证插件-v1.11.1和jQuery.validate.unobtrusive.js MVC4。
我也尝试过这样做,挂接到事件处理程序,但也不起作用:
$(document).ready(function () {
$("#myForm").on('invalid-form.validate',
function (form, validator) {
var errors = validator.numberOfInvalids();
if (errors) {
validator.errorList[0].element.focus();
}
}
);
});
如果单击submit按钮时包含无效输入,如何使带有regex data annotation validation属性的字段获得焦点?我最终解决了这个问题。 问题在于,错误输入出现的错误消息改变了按钮的位置。因此,点击实际上并不是点击按钮,而是点击背景,而背景会将焦点放在那里,而不是放在不正确的输入字段上
首先,应该通过使用不在验证错误上重新定位元素的设计来避免这种情况。您不能在“invalid-form.validate”上执行此操作:,因为此插件不提供类似invalid-form.validate的事件。验证由用户与表单的正常交互自动触发。。。点击、模糊、键入、更改、提交等。查看官方网站的插件方法和选项:如果您查看源代码,则存在无效表单。是的,它被触发了。.validate in invalid-form.validate是JQuery命名空间功能。在我尝试它时,焦点会起作用。问题可能出在其他地方。如果我点击并按住按钮一秒钟,然后松开按钮,我会觉得它按我想要的方式工作。好像事情的顺序搞砸了什么的。