如何使用jQuery Validate删除错误类?

时间:2011-12-18 02:17:12

标签: jquery css jquery-validate

我有一个表单,使用jQuery Validate插件为一组复选框的父div添加一个错误类。但是,选中复选框时,将删除错误类,但CSS样式仍然存在。我有什么想法吗?

示例:http://jsfiddle.net/qK3SC/

HTML:

<form name="itemForm" id="itemForm" method="post">
<div id="boxes">
    <input type="checkbox" id="check1" class="require-one" value="1" /> Item #1
    <input type="checkbox" id="check2" class="require-one" value="2" /> Item #2
</div>
<div id="freetext">
    <input type="text" class="required" />
</div>
<input type="submit" />
</form>

使用Javascript:

$.validator.addMethod('require-one', function(value) {
    return $('.require-one:checked').size() > 0;
}, 'Please check at least one box.');

var checkboxes = $('.require-one');
var checkbox_names = $.map(checkboxes, function(e, i) {
    return $(e).attr("name")
}).join(" ");

$("#itemForm").validate({
    groups: {
        checks: checkbox_names
    },
    errorPlacement: function(error, element) {
        if (element.is(':checkbox')) {
            $(element).parent('div').addClass('checkbox-error');

        }
        return true;
    }
});

更新

我能够使用highlight / unhighlight方法来获取错误类以用于复选框,但现在我的其他元素的错误类不起作用(即文本输入和下拉列表)。请参阅:http://jsfiddle.net/qK3SC/7/

2 个答案:

答案 0 :(得分:2)

答案 1 :(得分:0)

您是否尝试过在验证方法中使用成功选项?像

    $("#itemForm").validate({
groups: {
    checks: checkbox_names
},
errorPlacement: function(error, element) {
    if (element.is(':checkbox')) {
        $(element).parent('div').addClass('checkbox-error');

    }
    return true;
},
 success: function(){
       $('.checkbox-error').removeClass('.checkbox-eror');
}
    });