Question

I would like to set up a jQuery validate rule to require that YES (not no) be checked in order for the form to validate/submit. User must accept terms. If the user selects no they will get the error msg and the form will not validate. What is the correct way to accomplish this using jquery validate plugin?

<form id="myForm">
<input type="radio" name="terms" id="terms1" value="Yes!" class="required" title="Must accept terms to continue" /> Yes
<input type="radio" name="terms" id="terms2" value="No" class="required" title="Must accept terms to continue" /> No
</form>

$("#myForm").validate({ 

/*
Insert your awesome jquery validation code here. Free beer to whoever answers the question!
*/

}); 

Here is a working example:
http://jsfiddle.net/ThcS8/1/

Kudos to anyone who can provide a solution or even better an example! Vote this up if you are looking for the same solution so it gets attention. Thanks all!

Please vote for your favorite solution!

Answer 1

I also had this problem, and tried various things including the solutions mentioned above. In the end I wrote a custom validator method to check for a required value in a radio button:

jQuery.validator.addMethod("requiredRadioValue", function(value, element, params) { 
    var selectedValue = $('input:radio[name=' + element.name + ']:checked').val(); 
    return (typeof(params) == 'array') ? (params.indexOf(selectedValue) != -1) : selectedValue == params;
}, "You must select the required option."); 

The method is used e.g.

signedcif: { requiredRadioValue: 'yes' }

the allowed options can be an array or single value.

Hope this helps, I was hoping this wasn’t the most straight-forward way to do this, so any alternatives gratefully received!