jQuery Validate Plugin not working on radio buttons

html, jquery, validation

Solution

I think the most basic problem is happening here - the Validate plugin only works on visible things. So because you are using Bootstrap radio button sets, it hides the actual radios, and thus Validate ignores them.

It looks like you can get around this by just adding the `ignore` option to your validate call:

$("#rdrapply").validate({
    ignore:'',
    rules: {
       //etc
    }
});

Once I put that in, it immediately started throwing the errors (in an ugly way but you can work around that in your `errorPlacement` function if needed).

Problem

I have a large, multi-page form set up with the jQuery validation plugin. Everything seems to validate perfectly except for the radio buttons. I have spent hours reading through dozens of similar threads and none of the solutions offered seem to work. I have tried adding ``` class="required" ``` and ``` required="required" ``` and just ``` required ``` directly to the input attributes on the first radio button and none of them work. I have also added ``` rules: { myRadioGroupName: { required: true } ``` to no avail. I have set up a fiddle with a complete mockup including all dependencies. http://jsfiddle.net/j2372/2/ The 'Next' button navigation is not working properly on the fiddle, but the tab navigation at the top is. Click the "License" tab and then click "Next" to see the validation is working, just not on the radio groups. Where did i go wrong?

Original source