jQuery 验证 - 用户必须选择是单选（不是否）才能继续答案

【问题标题】：jQuery validate - User must select YES radio (not no) in order to conitnuejQuery 验证 - 用户必须选择是单选（不是否）才能继续
【发布时间】：2011-10-13 18:46:29
【问题描述】：

我想设置一个 jQuery 验证规则，要求检查是（不是否），以便表单验证/提交。用户必须接受条款。如果用户选择否，他们将收到错误消息并且表单将无法验证。使用 jquery validate 插件完成此操作的正确方法是什么？

<form id="myForm">
<input type="radio" name="terms" id="terms1" value="Yes!" class="required" title="Must accept terms to continue" /> Yes
<input type="radio" name="terms" id="terms2" value="No" class="required" title="Must accept terms to continue" /> No
</form>

$("#myForm").validate({ 

/*
Insert your awesome jquery validation code here. Free beer to whoever answers the question!
*/

});

这是一个工作示例： http://jsfiddle.net/ThcS8/1/

向任何可以提供解决方案甚至更好示例的人致敬！如果您正在寻找相同的解决方案，请投票支持它以引起关注。谢谢大家！

请为您最喜欢的解决方案投票！

【问题讨论】：

旁注：您不应该对两个单选按钮使用相同的 id。 ID 应该是唯一的。
谢谢 Juhana，我会改变的。
你看过stackoverflow.com/questions/1535187/…吗？
有什么理由需要两个单选按钮来表示是和否，而不仅仅是一个复选框“我同意”？

标签： jquery jquery-plugins jquery-validate

【解决方案1】：

我也遇到了这个问题，尝试了各种方法，包括上面提到的解决方案。最后，我编写了一个自定义验证器方法来检查单选按钮中所需的值：

jQuery.validator.addMethod("requiredRadioValue", function(value, element, params) { 
    var selectedValue = $('input:radio[name=' + element.name + ']:checked').val(); 
    return (typeof(params) == 'array') ? (params.indexOf(selectedValue) != -1) : selectedValue == params;
}, "You must select the required option.");

使用该方法，例如

signedcif: { requiredRadioValue: 'yes' }

允许的选项可以是数组或单个值。

希望这会有所帮助，我希望这不是最直接的方法，因此感谢您接受任何替代方法！

【讨论】：

【解决方案2】：

你应该从无输入单选中删除所需的，然后简单地做

$("form").validate();

这将初始化 jquery 验证。它将看到需要选择 yes 并且在它被选中之前不会让表单提交。

【讨论】：

感谢基思，但问题是没有错误消息告诉用户为什么表单没有提交。
这应该会强制 jquery validate 在单击提交时在该单选按钮下方弹出一个红色的“此字段是必需的”消息。您还可以使用 jquery validate 定义自己的自定义消息。请参阅此示例：docs.jquery.com/Plugins/Validation/validate#options 向下滚动，直到看到“消息”部分。
感谢 Keith 我正在使用 jQuery 验证，并且我的表单确实需要选择是或否，但是我希望它仅在用户选择是时提交。如果用户选择 no radio 我希望他们看到错误消息。
也许我做错了，但这种方法对我不起作用——它使“是”和“否”单选按钮都可以在同一时间。

【解决方案3】：

将值从 true 和 false 分别更改为 1 和 0。并添加规则对于

$('form').validate({
rules:{
    terms: {min:1}
},
messages:{
    terms: {min:'you must accept terms to move on.'}
}
});

【讨论】：

谢谢时髦！您能否更详细地向我展示您将如何做到这一点？
谢谢，我尝试添加该规则，现在无论我选择是还是否，它都会显示错误消息。想法？
忘记这条规则。尝试将 validate="required:true" 添加到 yes 单选元素。
并从无单选元素中删除 class="required"
感谢 Funky，仍然没有运气。查看此代码并根据需要进行编辑。 jsfiddle.net/ThcS8

【解决方案4】：

假设复选框具有“必需”类并且名称为“agreeForm”，则可以使用以下方法：

   jQuery("#regForm").validate({
      debug: true,
      rules: {
        agreeForm: "required",
      },
      messages: {
        agreeForm: "Please accept our Terms and Conditions.",
      }
    });

【讨论】：

谢谢 Demitry，我得试试这个。