jQuery Validate 插件不验证不是表单输入的元素答案

【问题标题】：jQuery Validate plugin not validating an element that's not a form inputjQuery Validate 插件不验证不是表单输入的元素
【发布时间】：2014-07-02 16:09:39
【问题描述】：

我需要使用 jQuery Validation Plugin 验证一个组合框组件：jqxComboBox。此组件应用于div。所以定义

<div id="component_id" />

$( "#component_id" ).jqxComboBox({...});

$("#component_id" ).rules( "add", {
    required: true,                  
    messages:{
        required: "Field is required"
    }
});

抛出以下异常：Cannot read property 'nodeType' of undefined。我认为这应该是因为我在 div 上应用了验证规则。

该组件生成一个隐藏的输入类型来保存选定的值。我也尝试在该隐藏组件上应用验证规则，但这不起作用：当隐藏没有价值时，表单也会提交。

$('input[type=hidden][name=myName]').rules( "add", {
    required: true,                  
    messages:{
        required: "Field is required"
    }
});

有人可以给我一些关于如何解决这个问题的提示吗？

【问题讨论】：

你能创建一个显示问题的小提琴吗？或者至少提供表单和div生成的HTML代码？
..不是现在，我不在工作。我明天可以发！但如果有用的话，这是组件的演示页面！ jqwidgets.com/jquery-widgets-demo/demos/jqxcombobox/…
尝试只使用输入字段的名称，而不是使用类型。并检查您生成的最终代码以确保您的目标是正确的输入元素。（例如，如果有 ID，您甚至可以通过 ID 定位它）
@Ramy 它没有 id.. 我也尝试省略 type 属性。我认为解决方案在下面的答案中..

标签： javascript jquery jquery-validate

【解决方案1】：

引用 OP：

“我需要使用 jQuery Validation Plugin 来验证一个组合框组件：jqxComboBox。这个组件是应用在一个 div 上的。”

正如您所了解的，您不能使用 jQuery Validate 来验证 div。您只能验证 <form> 容器中的 input、select 和 textarea 元素。

引用 OP：

“该组件生成一个隐藏的输入类型来保存选定的值。我也尝试在该隐藏组件上应用验证规则，但这不起作用：当隐藏没有值时也提交表单。”

将值放在隐藏的输入元素中是一种可接受的解决方法。

然而，默认情况下，jQuery Validate 插件会忽略所有隐藏的输入元素。只需将ignore 选项更改为[] 即可忽略“无”。在.validate() 调用中设置ignore 选项以及任何/所有其他选项。

$('#yourform').validate({
    // your other options, rules and callbacks,
    ignore: []  // <- ignore nothing - validate hidden elements
});

文档：http://jqueryvalidation.org/validate/#ignore

【讨论】：

jQuery Validate 插件将忽略所有隐藏的输入元素：这是一种非常方便的行为 :) 禁用该行为对我来说可能是个问题，只是为了使这些组合框验证正常工作.. 无论如何，谢谢你的回答，很有用
@gipinani，您不必对所有内容都禁用它。只需将 [] 替换为适当的 jQuery 选择器，这样它就会忽略所有除了你想要的。
我可以直接在字段上指定该选项（对我来说更好），还是让我将其设置为表单？
@gipinani，ignore 选项用于“忽略字段”。