form validation - require that a *specific* radio button is checked from each radio group
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 su开发者_如何学JAVAbmit button, to appear when and only when the previous "yes" button was checked, but I think that's going to be ugly and confusing.)
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
精彩评论