将 jquery 验证添加到 kendo ui 元素答案

【问题标题】：adding jquery validation to kendo ui elements将 jquery 验证添加到 kendo ui 元素
【发布时间】：2014-03-15 20:25:35
【问题描述】：

我查看了很多关于此的帖子，并且在我添加以下内容时它确实可以验证我的字段。

$.validator.setDefaults({
    ignore: []
});

我仍然缺少的部分是添加input-validation-error 类来通知用户。它适用于我的其他输入元素（非剑道）。我也尝试在 $.validator.setDefaults 中手动添加该类，但似乎没有任何效果。

在某处是否有示例或有人让它工作？

我不确定我这样做是否正确，但这是我尝试手动添加的内容。

$.validator.setDefaults({
    ignore: [],
    errorClass: "input-validation-error",
    errorElement: "input",
    highlight: function (element, errorClass) {
        $(element).addClass(errorClass)
    },
    unhighlight: function (element, errorClass) {
        $(element).removeClass(errorClass)
    }
});

【问题讨论】：

这个问题没有意义。默认情况下，插件会忽略所有隐藏字段。设置ignore: [] 只会禁用ignore 选项。换句话说，ignore: [] 允许验证隐藏字段，而不是忽略。您的问题与隐藏字段有什么关系？您的渲染 HTML 标记在哪里？
@Sparky 剑道和隐藏字段 - telerik.com/forums/mvc-unobtrusive-validation-doesn't-work

标签： asp.net-mvc-4 kendo-ui jquery-validate

【解决方案1】：

我找到了基于this post 的解决方案。基本上你需要做的是寻找 input 被包裹的父元素。像这样的东西：

$.validator.setDefaults({
    ignore: [],
    highlight: function (element, errorClass) {
        element = $(element);
        if (element.parent().hasClass("k-widget")) {
            element.parent().addClass('input-validation-error');
        } else {
            element.addClass('input-validation-error')
        }
    },
    unhighlight: function (element, errorClass) {
        element = $(element);
        if (element.parent().hasClass("k-widget")) {
            element.parent().removeClass('input-validation-error');
        } else {
            element.removeClass('input-validation-error')
        }
    }
});

我建议任何人在删除这个特定的兔子洞之前访问我上面链接的帖子，因为它引入了另一个问题，只是为了了解你正在进入的内容。例外的答案确实比那里提出的问题更相关。

【讨论】：