views:

22

answers:

1

I have a form with four yes-no questions, e.g.

I am age 18 or older.  () Yes  () No

HTML fragment:

<form>
...
<tr id="age_q">
  <td class="prompt">I am age 18 or older.</td>
  <td class="yesno">
    <input type="radio" name="age" value="yes" id="age_y" class="required">
    <label for="age_y">Yes</label>
    <input type="radio" name="age" value="no" id="age_n">
    <label for="age_n">No</label>
  </td>
</tr>
...

It is a consent form; the user may not proceed to the next page unless all four questions are answered "yes." I was trying to enforce this rule with jQuery + validator plugin, but its notion of "required" for radio groups seems to be "some button was checked" rather than "this button was checked."

Can anyone suggest a technique? I am not married to jQuery+validator, I would happily use some other library if it does what I want easily. Ideally, the submit button would be enabled when and only when all four "yes" radio buttons were checked. (The PHB wanted each of the questions, and the final submit button, to appear when and only when the previous "yes" button was checked, but I think that's going to be ugly and confusing.)

A: 

set your "no" radios to have a class .no or something:

if ($('.no:checked').length) {
     //not valid
} else {
    //valid
}

here's a working sample: http://jsbin.com/oguzi4/edit

Jason
"No .no is checked" is not quite what I need, but a slight variation works great. Thanks.
Zack
no problem! good luck :)
Jason