How to make jQuery Tools validation work with a group of radio buttons?

Question

I just can’t understand this ... (and judging by the long bout of web search, I'm not the only one). I have jQT validation; just not for radio stations - all I want to do is confirm that at least one of the buttons is pressed. I experimented with setting up a custom validation function via $ .tools.validator.fn, but I cannot find the right thing for the selector. I had no luck looking at the source code; any advice there? Thanks!

Answer 1

I must admit that this is a hack and needs to be adapted to your needs. This is what I came up with, and there may be better options.

Layout Example:

<form action="" id="theForm"> <fieldset> <input type="radio" name="sex" value="male" id="male" class="requiredCheckbox" /> <label for="male">Male</label><br /> <input type="radio" name="sex" value="female" id="female" /> <label for="female">Female</label><br/> <input type="radio" name="sex" value="unknown" id="unknown" /> <label for="unknown">Unknown</label> </fieldset> <input type="button" id="validate" value="Validate" /> </form> ​ 

Javascript with a custom validation method and a small hacker:

 $.validator.addMethod('requiredCheckbox', function (val, elt) { var valid = false; $('input[name=' + $(elt).attr('name') + ']:radio').each(function(inx, elt) { if (elt.checked === true) { valid = true; return; } }); return valid; }, 'Select at least one checkbox'); var options = { errorPlacement: function(error, elt) { $(elt).before(error); }, errorElement: 'div' }; var validator = $('#theForm').validate(options ); $('#validate').click(function() { $('#theForm').valid(); });​ 

Here's a JSFiddle with a working sample: http://jsfiddle.net/9DRcz/

Fun problem to develop :-)

Answer 2

Where am I (or finished):

• I gave up trying to get validation material in jQuery Tools for working with switches.

• @MK_Dev provided me with a way to use the jQuery Validation plugin ( http://bassistance.de/jquery-plugins/jquery-plugin-validation/ ), for which many thanks. However, an additional method in his answer was not needed - I get a radio button confirmation by loading the validation plugin, providing one of the radio buttons with the "required" class and calling .validate () on the form. It works great.

• The @jason link to Confirm radio button group using the jQuery validation plugin also paid off. My last confusion about all this is that some of the discussions on this page about how the bassist checker plugin is not needed is that jQuery (1.3.2 ??) can do the validation on its own. Maybe, but I could not understand.

In any case, now I have some working validation, which is more than I could say earlier today. Thanks everyone!

Answer 3

I have earned. They do not provide any examples in the jQueryTools Validator documentation using the radio buttons: http://jquerytools.org/documentation/validator/index.html

Here is the corresponding source code.

In the page title indicate:

 <script src="http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js"></script> <script> $(document).ready(function() { $("#myform").validator(); }); </script>` 

In the body of the page:

 <form id="myform" name="myform" method="post" action="next-page.php"> <label>Option One</label> <input type="radio" required="required" name="RadioGroup1" id="RadioButton_1" /> <label>Option Two</label> <input type="radio" required="required" name="RadioGroup1" id="RadioButton_2" /> <label>Option Three</label> <input type="radio" required="required" name="RadioGroup1" id="RadioButton_3" /> <input type="submit" name="continue_to_next_page" id="submit" value="Continue" /> </form> 

Let us know if this works for you.