D7net
Home
Console
Upload
information
Create File
Create Folder
About
Tools
:
/
home
/
forge
/
shaghela.online
/
node_modules
/
bootstrap-validator
/
sandbox
/
Filename :
checkbox-group.html
back
Copy
<!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery.min.js"></script> <link href="http://getbootstrap.com/dist/css/bootstrap.css" rel="stylesheet" type="text/css" /> <script src="http://getbootstrap.com/dist/js/bootstrap.js"></script> <script src="../js/validator.js" type="text/javascript"></script> <title></title> </head> <body> <div class="well"> <form id="myForm"> <div class="form-group"> <div class="checkbox"> <label> <input type="checkbox" name="check-1" data-chkgrp="check"> Check 1 </label> </div> <div class="checkbox"> <label> <input type="checkbox" name="check-2" data-chkgrp="check"> Check 2 </label> </div> <div class="checkbox"> <label> <input type="checkbox" name="check-3" data-chkgrp="check"> Check 3 </label> </div> <div class="help-block with-errors"></div> </div> </form> <div class="form-group"> <button type="submit" form="myForm" class="btn btn-primary">Submit</button> <button type="reset" form="myForm" class="btn btn-default">Reset</button> </div> </div> <script type="text/javascript"> $('#myForm').validator({ custom: { chkgrp: function ($el) { var name = $el.data('chkgrp'); var $checkboxes = $el.closest('form').find('input[data-chkgrp="' + name + '"]'); if (!$checkboxes.is(':checked')) { return 'Need at least one checked' } } } }).on('change.bs.validator', '[data-chkgrp]', function (e) { var $el = $(e.target) var name = $el.data('chkgrp') var $checkboxes = $el.closest('form').find('input[data-chkgrp="' + name + '"]') $checkboxes.not(':checked').trigger('input') }) </script> </body> </html>