CODEWITHSUNDEEP
jqueryvalidation
Keith Sorbo
Keith Sorbo

Reputation: 25

jquery validate radio buttons

I am not able to get the radio buttons for Gender to register an error. I have tried several options:

None of these options give an error in the js console, but none trigger an validation error,
if I leave the gender option unselected upon submit.

I have jQuery in the header of the page. I know it is functioning.

<form action="https://example.com" method="post" id="formBuilder" class="formBuilder">
  <p>
    <label for="form-1"><span class="red">*</span> E-Mail Address</label>< br/>
    <input maxlength="255" name="fb[1]" size="50" type="email" id="form-1" required/> <br/>

    <label for="form-2"><span class="red">*</span> Full Name</label> <br/>
    <input maxlength="255" name="fb[2]" size="50" type="text" required id="form-2"/> <br/>

    <label><span class="red">*</span> Gender</label> <br/>
    <input name="fb[15]" type="radio" value="0"  id="form-15-0"/>

    <label for="form-15-0">Male</label>
    &nbsp;&nbsp; <input class="required" name="fb[15]" type="radio" value="1" id="form-15-1"/>

    <label for="form-15-1">Female</label>

    <label for="form-8"><span class="red">*</span> Request</label> <br/>
    <textarea cols="40" name="fb[8]" rows="3" id="form-8" required></textarea> <br/>

    <span><span class="red">*</span>= required information </span>
  </p>

  <span class="buttons">
    <input name="submit" type="submit" value="Submit" id="form-submit"/>
  </p>
</form>

<script src="/wp-includes/js/jquery.validate.min.js"></script>
<script>
$('#formBuilder').validate( );
</script>

Upvotes: 0

Views: 224

Answers (1)

Amr Aly
Amr Aly

Reputation: 3905

Try to change your name attribute for radio input to different name for example test without [] so it will be name="test":

and your rules will be :

$('#formBuilder').validate({
    rules: {
        test: { 
            required: true
        }
    }
});

Upvotes: 1

Related Questions