验证表单与单选按钮

Question

UPDATE：

rules: { 
        firstname: "asdfsadf", 
        lastname: "123123", 
        city: "required", 
        state: "required", 
        country: "required" , 
        question_1: "required" 


       }, 
       messages: { 
        firstname: "Please enter your firstname", 
        lastname: "Please enter your lastname", 
        city: "Please enter a valid email address", 
        country: "Please accept our policy", 
        question_1: "SELECT at least one question." 
       } 

    <div class="question"> 
     Q1: What is the second letter of the alphabet? 
     <div class="choices"> 
      <input type="radio" name="question_1" value="1" /> A 
      <input type="radio" name="question_1" value="2" /> B 
      <input type="radio" name="question_1" value="3" /> C 
     </div> 
    </div> 
    <div class="question"> 
     Q2: Which out of these is a berry? 
     <div class="choices"> 
      <input type="radio" name="question_2" value="1" /> Apples 
      <input type="radio" name="question_2" value="2" /> Bananas 
      <input type="radio" name="question_2" value="3" /> Carrots 
     </div> 
    </div> 

我使用bassistance jQuery插件来验证我的形式。和所有其他验证工程就好，但单选按钮是给出了问题，我将如何验证单选按钮，我希望用户选择至少一个单选按钮。

<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script> 
<script src="Scripts/jquery.validate.min.js" type="text/javascript"></script> 


<script type="text/javascript"> 

     $(document).ready(function() { 

      // validate the comment form when it is submitted 
      // validate signup form on keyup and submit 
      $("#signupForm").validate({ 
       rules: { 
        firstname: "asdfsadf", 
        lastname: "123123", 
        city: "required", 
        state: "required", 
        country: "required" 
       }, 
       messages: { 
        firstname: "Please enter your firstname", 
        lastname: "Please enter your lastname", 
        city: "Please enter a valid email address", 
        country: "Please accept our policy" 
       } 
      }); 
     }); 

<form class="cmxform" id="form1" method="get" action=""> 
    <fieldset> 
     <legend>Validating a form with a radio and checkbox buttons</legend> 
     <fieldset> 
      <legend>Gender</legend> 
      <label for="gender_male"> 
       <input type="radio" id="gender_male" value="m" name="gender" validate="required:true" /> 
       Male 
      </label> 
      <label for="gender_female"> 
       <input type="radio" id="gender_female" value="f" name="gender"/> 
       Female 
      </label> 
      <label for="gender" class="error">Please select your gender</label> 
     </fieldset> 

     <p> 
      <input class="submit" type="submit" value="Submit"/> 
     </p> 
    </fieldset> 
</form> 

Answer 1

这里是我如何解决问题：希望这可以帮助别人。

<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script> 
<script src="Scripts/jquery.validate.min.js" type="text/javascript"></script> 

<div class="question"> 
     Q1: What is the second letter of the alphabet? 
     <div class="choices"> 
      <input type="radio" name="question_1" value="1" class="required" /> A 
      <input type="radio" name="question_1" value="2" /> B 
      <input type="radio" name="question_1" value="3" /> C 
      <label for="question" class="error">Please select your at leat one question</label> 
     </div> 
    </div> 

Answer 2

有很多方法可以做到这一点。

if ($('input:radio:checked').length) 
{ 
at least one is checked 
} 
else 
{ 
none are checked 
} 

当然，你会想通过名称来选择（以防万一您有多个单选按钮组）

if ($('input[name="yourNameHere"]:checked').length) 

Answer 3

在您的“规则”的对象，你应该只能够做到：

gender: "required" 

或者，你似乎有自定义属性：

validate="required:true" 

......在你的“男性”收音机上。您应该可以将这两个输入添加到name =“gender”，并且该功能也应该可以正常工作。 See the radio/checkbox demo。

如果你想做更复杂的事情，插件可以让你选择创建自己的验证方法。