Multiple Checkboxes Validation

This is a regular problem and solution is hardly available on google. When we use multiple checkboxes of same group (same name with square brackets) and you've to read the values from server side, then below solution will help you. Here I'm using jQuery (https://jquery.com/) and jQuery Validate plugin (https://jqueryvalidation.org/)

For an example, I've to ask a user which of the listed book they are interested to know about


 
 <form id="BooksForm" method="post" name="BooksForm">
 <p>Books you are interested in </p>
    <input class="Books" id="Book1" name="Books[]" type="checkbox" value="1" /> The Inner Game of Tennis <br />
    <input class="Books" id="Book2" name="Books[]" type="checkbox" value="1" /> Monk who sold his ferrari <br />
    <input class="Books" id="Book3" name="Books[]" type="checkbox" value="1" /> Leading Without Authority <br />
    <input class="Books" id="Book4" name="Books[]" type="checkbox" value="1" /> Life's Amazing Secrets <br />
    <label class='error' for='Books[]'></label>
    <input id="Submit" name="Submit" type="submit" value="Submit" />
 </form>
 
 <script crossorigin="anonymous" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
 <script crossorigin="anonymous" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.2/jquery.validate.js"></script>
 
 <script>
    $.validator.addMethod('Books', function (value, element) {
      return value > 0;
    }, 'Please select at least one checkbox');

	$('#BooksForm').validate({
      ignore: [],
      submitHandler: function(){
        alert($('.Books').val());
        return false;
      }
   });
</script>