无法使用jQuery验证多个选择框

版本2

我有一个多重选择框,用户应在其中至少选择2个值。我将jQuery与Bootstrap结合使用。但是我没有任何结果。

我的html表单包含一个多选框。该表格是使用Twitter-Bootstrap设计的。我已经编写了一个jQuery函数来验证表单。我能够成功验证所有其他输入字段。

任何帮助。

小提琴

的HTML

<form>       
    <div class="form-group">
        <label class="control-label" for="lastname">multiple:</label>
        <div class="input-group">
             <select data-placeholder="Add Invitees" name="invitees[]" multiple class="chosen-select" tabindex="8">
                <option value="black">Black</option>
                <option value="blue">Blue</option>
                <option value="green">Green</option>
                <option value="orange">Orange</option>
                <option value="red">Red</option>
                <option value="yellow">Yellow</option>
                <option value="white">White</option>
            </select>
        </div>
    </div>

        <button type="submit" class="btn btn-primary">Submit</button>
</form>

jQuery的

$('form').validate({
    rules: {
        invitees: {
            minlength: 2,
            required: true
        }
    },
    highlight: function(element) {
        $(element).closest('.form-group').addClass('has-error');
    },
    unhighlight: function(element) {
        $(element).closest('.form-group').removeClass('has-error');
    },
    errorElement: 'span',
    errorClass: 'help-block',
    errorPlacement: function(error, element) {
        if(element.parent('.input-group').length) {
            error.insertAfter(element.parent());
        } else {
            error.insertAfter(element);
        }
    }
});
擎天柱

使用'invitees[]',而不是invitees看到更新后的代码..检查这个小提琴

 $('form').validate({
        rules: {
            'invitees[]': {
                minlength: 2,
                required: true
            }
        },
        highlight: function(element) {
            $(element).closest('.form-group').addClass('has-error');
        },
        unhighlight: function(element) {
            $(element).closest('.form-group').removeClass('has-error');
        },
        errorElement: 'span',
        errorClass: 'help-block',
        errorPlacement: function(error, element) {
            if(element.parent('.input-group').length) {
                error.insertAfter(element.parent());
            } else {
                error.insertAfter(element);
            }
        }
    });

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章