jquery Validation - 尝试验证单选和复选框按钮并使用 ErrorPlacement 在每个组下方显示错误答案

【问题标题】：jquery Validation - trying to Validate Radio and checkbox bottons and use ErrorPlacemant to display Error Below each groupjquery Validation - 尝试验证单选和复选框按钮并使用 ErrorPlacement 在每个组下方显示错误
【发布时间】：2011-11-26 14:13:59
【问题描述】：

这里是新手我正在尝试让单选按钮和复选框按钮进行验证。

错误消息应该出现在最后一组单选框/复选框下

单选按钮需要选择复选按钮至少需要一个选择

--- 在媒体上，由于所有人都有唯一的 ID，我将其视为一个组，但在 addMethod 来验证组。

--- 同样在 errorPlacement 上，如果我没有元素 ID，我该怎么办？

http://jsbin.com/aqekah/14

基本上没问题，但现在我的警报中的 InValids 数量错误

【问题讨论】：

我试过“error.prependTo(element());”但这将错误消息置于无线电组之上。 :(
更新：我为复选框添加了 2 种方法，我希望重用一种方法，但我必须克隆它“require-one”和“require-1”我所做的另一个更改是让它显示在复选框三重奏组的底部，我在每个复选框集中给最后一个标签一个 ID，然后在 ErrorPlacement 中使用它。我愿意接受建议:)
更新：单选按钮，为每组最后一个单选按钮添加了标签 ID。然后我将它用于错误放置。我想我已经完成了，对它并不完全满意，所以请就我做错了什么或改进它或使它更清洁提出建议。谢谢
还有一个问题。我的警报中的 InValids 数量错误。如果一个 checlbox 集合中出现错误，则将该集合计为 3 个错误而不是 1 个。:(((

标签： jquery forms jquery-validate

【解决方案1】：

实际上，我们前几天就遇到了这个问题，这就是我解决它的方法：

var validator = $('form#yourID').validate({
        errorPlacement: function (error, element) {
            if (element.is(":radio")) {
                element.closest('.rbl').after(error);
                element.closest('.rbl').addClass('error');
            }
            else if (element.is(":checkbox")) {
                element.closest('.cbl').after(error);
                element.closest('.cbl').addClass('error');
            }
            else { // This is the default behavior of the script
                error.insertAfter(element);
            }
        },
        rules: { ...

其中.rbl 是<table> 标记，如下所示：

<table cellpadding="0" cellspacing="0" class="rbl">
<tr><td><label><input type="radio" name="myradio" value="1"> Radio 1</label></td></tr>
<tr><td><label><input type="radio" name="myradio" value="2"> Radio 2</label></td></tr>
</table>

css:

FORM .rbl
{
    float: left;
}
FORM .rbl TD
{
    padding: 4px 24px 0 0;
}

这同样适用于带有.cbl 的复选框列表。所有其他非单选和复选框类型都将使用标准错误放置。

希望对您有所帮助。

【讨论】：