使用jQuery验证插件验证单选按钮组

Question

如何使用jQuery验证插件执行单选按钮组的验证(应该选择一个单选按钮)？

Answer 1

随着更新版本的jquery(我认为是1.3+),你所要做的就是设置一个必需的收音机成员,jquery将负责其余的事情:

<input type="radio" name="myoptions" value="blue" class="required"> Blue<br />
<input type="radio" name="myoptions" value="red"> Red<br />
<input type="radio" name="myoptions" value="green"> Green

在继续之前,上述将要求选择3个无线电选项中的至少1个与"我的选项"的名称.

Mahes的标签建议,顺便说一句,效果非常好!

Answer 2

使用以下规则验证单选按钮组选择

myRadioGroupName : {required :true}

myRadioGroupName是您为name属性赋予的值

Answer 3

你也可以用这个:

<fieldset>
<input type="radio" name="myoptions[]" value="blue"> Blue<br />
<input type="radio" name="myoptions[]" value="red"> Red<br />
<input type="radio" name="myoptions[]" value="green"> Green<br />
<label for="myoptions[]" class="error" style="display:none;">Please choose one.</label>
</fieldset>

并简单地添加此规则

rules: {
 'myoptions[]':{ required:true }
}

提到如何添加规则.

Answer 4

根据布兰登的回答。但是，如果您使用的是使用非侵入式验证的 ASP.NET MVC，则可以将 data-val 属性添加到第一个。我也喜欢为每个单选按钮添加标签以提高可用性。

<span class="field-validation-valid" data-valmsg-for="color" data-valmsg-replace="true"></span>
<p><input type="radio" name="color" id="red" value="R" data-val="true" data-val-required="Please choose one of these options:"/> <label for="red">Red</label></p>
<p><input type="radio" name="color" id="green" value="G"/> <label for="green">Green</label></p>
<p><input type="radio" name="color" id="blue" value="B"/> <label for="blue">Blue</label></p>