执行 jqueryvalidation 后如何传播元素无效?
How can I propagate an element is invalid after executing jqueryvalidation?
当按下表单的提交按钮时,将执行表单验证。一个特定的元素——一个下拉列表——可能无法通过验证并收到一个新的 class 标记为无效。当添加这个 class 时,我希望有另一个单独的 DOM 元素来通知这个新的 class 添加。然后另一个元素必须将错误 [=21=] 从经过验证的元素复制到它自己的 class 属性以进行样式设置(反之亦然,当重新验证成功时)。此行为不适用于所有表单元素。因此,通过插件的 highlight- 或 errorPlacement-callbacks 进行的一般实现在我的情况下似乎不可用,因为据我了解,此回调适用于所有表单元素,而不是我需要的单个表单元素。
我似乎对如何通过侦听器连接到验证过程感到困惑。我检查了 Plugin Docs 以确定是否以及在何处可能在验证后触发事件,但找不到任何有关的信息。
你们中是否有人可能有相同的要求并找到了可以分享的可行解决方案?
编辑:
扩展了问题描述以澄清问题
The other element must receive the validated elements error-class for styling.
您可以使用 highlight
选项根据需要应用样式。当使用 highlight
选项时,您还可以使用 unhighlight
选项来做相反的事情。
highlight: function(element, errorClass, validClass) {
$(element).addClass(errorClass).removeClass(validClass);
// and/or something like this?
$(element).parent('div').addClass(errorClass).removeClass(validClass);
},
unhighlight: function(element, errorClass, validClass) {
$(element).addClass(validClass).removeClass(errorClass);
// and/or something like this?
$(element).parent('div').addClass(validClass).removeClass(errorClass);
}
以上是一个非常通用的示例,与默认设置类似。您需要使用任何适当的 jQuery DOM 遍历方法来做一些您自己的事情。你从来没有真正准确地描述过你想做什么,所以我无法提供定制的解决方案。
编辑
您可以有条件地应用这些函数,以便它只影响特定元素。
在此示例中,error/valid classes 将 也 应用于具有 class .foo
。您可以根据需要编辑条件和 jQuery 选择器...
highlight: function(element, errorClass, validClass) {
$(element).addClass(errorClass).removeClass(validClass); // default
// with something like this?
if ($(element).hasClass('foo')) {
$(element).siblings('select').addClass(errorClass).removeClass(validClass);
}
},
unhighlight: function(element, errorClass, validClass) {
$(element).addClass(validClass).removeClass(errorClass); // default
// with something like this?
if ($(element).hasClass('foo')) {
$(element).siblings('select').addClass(validClass).removeClass(errorClass);
}
}
当按下表单的提交按钮时,将执行表单验证。一个特定的元素——一个下拉列表——可能无法通过验证并收到一个新的 class 标记为无效。当添加这个 class 时,我希望有另一个单独的 DOM 元素来通知这个新的 class 添加。然后另一个元素必须将错误 [=21=] 从经过验证的元素复制到它自己的 class 属性以进行样式设置(反之亦然,当重新验证成功时)。此行为不适用于所有表单元素。因此,通过插件的 highlight- 或 errorPlacement-callbacks 进行的一般实现在我的情况下似乎不可用,因为据我了解,此回调适用于所有表单元素,而不是我需要的单个表单元素。
我似乎对如何通过侦听器连接到验证过程感到困惑。我检查了 Plugin Docs 以确定是否以及在何处可能在验证后触发事件,但找不到任何有关的信息。
你们中是否有人可能有相同的要求并找到了可以分享的可行解决方案?
编辑: 扩展了问题描述以澄清问题
The other element must receive the validated elements error-class for styling.
您可以使用 highlight
选项根据需要应用样式。当使用 highlight
选项时,您还可以使用 unhighlight
选项来做相反的事情。
highlight: function(element, errorClass, validClass) {
$(element).addClass(errorClass).removeClass(validClass);
// and/or something like this?
$(element).parent('div').addClass(errorClass).removeClass(validClass);
},
unhighlight: function(element, errorClass, validClass) {
$(element).addClass(validClass).removeClass(errorClass);
// and/or something like this?
$(element).parent('div').addClass(validClass).removeClass(errorClass);
}
以上是一个非常通用的示例,与默认设置类似。您需要使用任何适当的 jQuery DOM 遍历方法来做一些您自己的事情。你从来没有真正准确地描述过你想做什么,所以我无法提供定制的解决方案。
编辑
您可以有条件地应用这些函数,以便它只影响特定元素。
在此示例中,error/valid classes 将 也 应用于具有 class .foo
。您可以根据需要编辑条件和 jQuery 选择器...
highlight: function(element, errorClass, validClass) {
$(element).addClass(errorClass).removeClass(validClass); // default
// with something like this?
if ($(element).hasClass('foo')) {
$(element).siblings('select').addClass(errorClass).removeClass(validClass);
}
},
unhighlight: function(element, errorClass, validClass) {
$(element).addClass(validClass).removeClass(errorClass); // default
// with something like this?
if ($(element).hasClass('foo')) {
$(element).siblings('select').addClass(validClass).removeClass(errorClass);
}
}