【发布时间】:2016-11-21 16:10:59
【问题描述】:
正如标题所说,我在 MVC 应用程序中的 javascript 中遇到 JQuery Unobtrusive 验证问题。
我做了什么:
我的表单上的输入已与适当的规则绑定,这些规则将在我的自定义 javascript 中进行检查:
<input type="text" class="form-control" name="rates_taxes" id="rates_taxes" data-val='true' data-val-ispositive="You must enter a positive value here or 0" data-val-isnumeric="You must enter a numerical value here. (e.g 250000)" required>
...
jQuery.validator.addMethod('isnumeric', function (value) {
return $.isNumeric(value);
}, '');
jQuery.validator.unobtrusive.adapters.add('isnumeric', function (options) {
options.rules['isnumeric'] = {};
options.messages['isnumeric'] = options.message;
});
这里没有显示,我已经测试了当用户输入输入或提交表单时确实输入了 isNumeric 方法。
问题在于表单的提交。 InvalidHandler 和 SubmitHandler 这两个事件根本不会触发。
我已经使用 Jquery Validation Site 上的方法实现了它 - 它将处理程序作为 Javascript 对象传递给 $("form").validate({ invalidHander: function(e, validator){ ... }); 方法 - 它没有触发
现在我有这种方法:
$(document).on("click", "button[type='submit']", function (e) {
if ($(e.target).data("customValidate") === true) {
e.preventDefault();
var form = $(e.target).parents("form");
$(form).data("validator").settings.submitHandler = function (formhandler) {
alert('submit');
formhandler.submit();
}; // <----
$(form).data("validator").settings.invalidHandler = function (e, validator) {
alert('error');
for (var i = 0; i < validator.errorList.length; i++) {
var element = '#' + validator.errorList[i].element.name;
var error = validator.errorList[i].message;
if (!error || error === "undefined") {
error = "This field is required.";
}
$(element).prop('title', error);
$(element).data('placement', 'right');
$(element).data('toggle', 'tooltip').tooltip('show');
}
}; // <----
$(form).validate();
}
});
这是直接在表单的数据中为Jquery Unobtrusive Validation Engine设置无效和有效的处理程序。
这两种方法都不起作用。在此方法有效之前,我曾与我的团队在另一个 MVC 站点上工作过,尽管我还没有实现不显眼的验证 - 所以我在上面实现时这不起作用的原因让我无法理解。
关于我可能错过的任何建议?
【问题讨论】:
-
有点无关紧要 - 在我尝试这些方法之前(这是正确的),我只检查了错误列表中的条目。在我第一次提交表单时,即使字段错误,错误列表也是空的。立即第二次提交表单,它被填充并显示代码中的工具提示
标签: jquery asp.net-mvc-4 jquery-validate unobtrusive-validation