JSFiddle - React, Tailwind, and code Playground

by tiagocarvalho

HTML

<script src="http://jquery.bassistance.de/validate/jquery.validate.js"></script>
<form name="itemForm" id="itemForm" method="post">
    <div id="quest1" class="ibReqGroup" >
        <input type="checkbox" name="check1a" id="check1a" class="require-one" value="1" />
        <input type="checkbox" name="check1a" id="check2a" class="require-one" value="2" />
    </div>
    <div id="quest2">
        <input type="checkbox" name="check1b" id="check1b" class="require-one" value="1" />
        <input type="checkbox" name="check2b" id="check2b" class="require-one" value="2" />  
    </div>
<input type="text" class="required" />
<input type="submit" />
</form>

JavaScript

/*$.validator.addMethod('require-one', function (value) {
              return $('.require-one:checked').size() > 0; }, 'Please check at least one box.');
*/

   /* $.validator.addMethod('validate-checkbox-oneormore', function (value) {
    

return $('.require-one:checked').size() != 0; }, 'need a value'); */




    
     $.validator.addMethod('ibReqGroup', function (value) 
     {
       $('.ibReqGroup').each(function() {       
        return $('.require-one:checked').size() != 0; 
       })
     }, 'ne  value');


var checkboxes = $('.require-one');
var checkbox_names = $.map(checkboxes, function(e,i) { return $(e).attr("name")}).join(" ");
                                                       
                                                       

$("#itemForm").validate({ 
   
/*    groups: { checks: checkbox_names },
    */
    errorPlacement: function(error, element) {
             if (element.attr("type") == "checkbox") 
               error.insertAfter(checkboxes.last());
             else
               error.insertAfter(element);
    }        
});
                                                           
 $(document).ready(function() {
    alert(checkbox_names);
});