corrade-nucleus-nucleons
| /base/000_base/node_modules/bootstrap-validator/sandbox/checkbox-group.html |
|---|
| @@ -0,0 +1,72 @@ |
| <!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> |