如何在jquery.multiselect下拉列表中使用jquery.Validate？

Question

所以,情况是这样的:在尝试使用添加下拉框jquery.multiselect插件形式对当前使用jquery.validate有其他领域(文本输入字段,具有单个文本输入插件float数值范围),所有当前验证正确.

当我尝试添加验证规则,我根本无法jquery.validate到任何验证我的多选下拉列表.以下是我的代码片段(所有代码都假设已加载所需的插件 - 请参阅下面的使用版本):

HTML:

<form action="some/action" id="myForm" method="POST">
    Input 1: <input type="text" value="" name="input1" maxlength="200" id="input1"><br/>
    Input 2: <input type="text" value="" name="input2" maxlength="100" id="input2"><br/>
    Input 3: <input type="text" value="" name="input3" maxlength="50" id="input3"><br/>
    Select: <select class="someSelect" name="mySelect" id="mySelect" multiple="multiple">
        <option value="some_val1">Some Value</option>
        <option value="some_val2">Some Other Value</option>
    </select>
    <input type="submit" value="Submit" />
</form>

Javascript:

$(document).ready(function() {
    $('#mySelect').multiselect({
        noneSelectedText: 'Select Something (required)',
        selectedList: 3,
        classes: 'my-select'
    });

    $.validator.addMethod("needsSelection", function(value, element) {
        return $(element).multiselect("getChecked").length > 0;
    });

    $.validator.addMethod("isPercent", function(value, element) {
        return parseFloat(value) >= 0 && parseFloat(value) <= 100;
    });

    $.validator.messages.needsSelection = 'You gotta pick something.';
    $.validator.messages.isPercent = 'Must be between 0% and 100%';

    $('#myForm').validate({
        rules: {
            mySelect: "required needsSelection",
            input1: "required isPercent",
            input2: "required",
            input3: "required"
        },
        errorClass: 'invalid'
    });
});

版本 如果版本之间存在明确/已知的兼容性问题,那么我可以升级,如果这解决了问题,但我已经测试使用最新版本用于我的目的,它似乎没有解决我的问题.

jQuery:1.4.4

jquery.validate:1.9.0

jquery.multiselect:1.8

而且,与往常一样,我可以在可能/需要的地方提供更多信息.

Answer 1

如此看来,我建立了多选的规则确实正在连接到选择,但由于原来的选择框是:hidden由jquery.multiselect,jquery.validate在默认情况下会忽略任何隐藏的输入.

解决方案(不是我自己的 - 同事找到它)是使用ignore设置jquery.validate.无论哪个选择器传入ignore设置都放入jquery .not(),所以解决方案实际上是在这里使用双重否定:

$('#myForm').validate({
    rules: {
        mySelect: "required needsSelection",
        input1: "required isPercent",
        input2: "required",
        input3: "required"
    },
    ignore: ':hidden:not("#mySelect")', //Tells it to check the hidden select
    errorClass: 'invalid'
});

唷!