Question

我有几个单选按钮：

<div><label><input type="radio" name="Impression" value="Excellent"> Excellent</label></div>
<div><label><input type="radio" name="Impression" value="Good"> Good</label></div>
<div><label><input type="radio" name="Impression" value="Poor"> Poor</label></div>

然后......

$("#RegisterForm").validate({
    rules: 
        {
           'Impression': { required: true }
        }
    });

required在用户无法提交表单的意义上起作用，并且如果未选择一个，则会将用户滚动回这些按钮。但与此表单中的所有其他输入选项（文本和下拉菜单）不同，单选按钮不会显示任何错误消息。

Answer 1

看起来你错过了错误标签：

<label for="Impression" class="error">Please select an impression.</label>

当验证出现问题时，jQuery validate不知道要显示什么。

Example from jQuery.validate's documentation

编辑：要隐藏标签，请不要包含内容。在验证失败之前，标签应该是用户的指导性消息，此时它将成为验证失败消息。

http://jsfiddle.net/1k3zfqxq/

Answer 2

您无需提前创建任何错误元素。

我认为您的DOM布局存在问题，其中默认错误消息被设计中的其他元素覆盖。由于我们无法看到您的DOM，因此我们无法确切知道如何修复它。但是，您可以检查您的特定DOM，并根据下面的通用示例找出确切的解决方案。

默认情况下，错误消息是label元素，并且在输入元素之后动态插入。如果是radio或checkbox，则会在广播组中的第一个元素之后插入。errorPlacement或errorPlacement: function(error, element) { if (element.attr("type") == "radio") { error.insertBefore(element.parents('div')); // place it before the radio group } else { error.insertAfter(element); // default placement } }。您可以使用{{1}}选项有条件地将此消息放在其他位置。

{{1}}

DEMO ：http://jsfiddle.net/jktLyLgy/

使用jquery验证时，单选按钮没有错误消息

2 个答案: