jQuery Validate Unobtrusive - 挂钩到单个输入的错误事件

Question

我正在使用ASP.NET MVC构建一个站点,并且正在使用jQuery validate unobtrusive库.我想知道是否有一种方法可以挂钩显示验证消息的事件,例如在用户输入无效内容的位置(与他们点击提交按钮的瞬间相反).

我想这样做的原因是因为我正在设置我的错误消息,如迷你弹出窗口,它出现在具有错误的字段上方 - 即使用绝对定位.由于单个字段可能具有各种不同的验证错误,我希望能够正确设置字段的位置以考虑消息的可变高度.我还需要处理这个事件,这样我就可以在输入元素周围应用一个红色边框的类.

Answer 1

这里有一个很棒的脚本:https://gist.github.com/remi/957732,它为jQuery.validate中的不同事件设置了钩子.它允许您绑定到一堆不同的事件,在您的情况下它将如下所示:

$(function () {
    $('form').addTriggersToJqueryValidate();
    $('form').bind("elementValidation", function (event, element, result) {
        console.log("Something is invalid");
    });
})

非常便利!

Answer 2

当用户移动到表单中的下一个元素时，您可以验证并形成元素

$("form#myformid").validate().element("#ModelObject_NameofField");

并对每个元素使用 errorplacement，如前面的答案所示

jquery - 如何对特定元素使用 errorPlacement？

您的弹出窗口<div/>应该随着其中的文本一起增长，因此您只需要锚定元素旁边的左下角或右下角即可。