Jqueryvalidation隐藏了kendo-ui控件

我有一个使用kendo-ui numericTextBox

 @Html.LabelFor(p => p.Cost) @Html.TextBoxFor(p => p.Cost, new { @autocomplete = "off" }) 

我绑定它，然后，使其与jquery validate插件一起工作，我设置以下设置：

 $("#Cost").kendoNumericTextBox({ format: "c", min: 0, decimals: 2 }); $.validator.setDefaults({ ignore: [], highlight: function (element, errorClass) { element = $(element); if (element.hasClass("k-input")) { element.closest(".k-widget").addClass(errorClass); } else { element.addClass(errorClass); } }, unhighlight: function (element, errorClass) { element = $(element); if (element.hasClass("k-input")) { element.closest(".k-widget").removeClass(errorClass); } else { element.removeClass(errorClass); } } }); 

当我尝试提交表单并且Cost输入无效时，它会正确添加errorClass（在.k .k-widget包装器上）。

问题是，如果我再次按下提交按钮，那么kendo-ui元素就会消失（使用style="display: none;" ）。

我不知道是什么触发了这一点。 我已经看到，如果我将errorClass更改为input-validation-error以外的其他内容，那么kendo kendo-ui小部件仍然可见。

此问题仅适用于kendo-ui控件，而不适用于标准html输入。

我做错了什么？

Answer 1

我打赌数字texbox控件是双重包装，就像datepicker控件一样。 以下是我在validator配置中使用的highlight()和unhighlight()函数，用于确定将错误类应用于哪个元素：

 ... highlight: function (element, errorClass, validClass) { var e = $(element), parent = _getParent(e); _addClass(e, parent); }, unhighlight: function (element, errorClass, validClass) { var e = $(element), parent = _getParent(e); _removeClass(e, parent); } ... function _getParent(element) { // a Kendo DatePicker is double-wrapped, so that requires us to return the parent of the parent return (element.parent().hasClass('k-picker-wrap')) ? element.parent().parent() : element.parent(); } function _addClass (element, parent) { if (parent.hasClass('k-widget')) { parent.addClass('error'); } else { element.addClass('error'); } } function _removeClass(element, parent) { if (parent.hasClass('k-widget')) { parent.removeClass('error'); } else { element.removeClass('error'); } } 

Answer 2

为了解决元素在第二次提交时消失的问题，我这样做了：

 $("form").submit(function (event) { $(".k-widget").removeClass("input-validation-error"); }