0

I have the next HTML code:

          <div class="form-group">
              <div class="col-sm-12 divider">
                <br><label><input type="checkbox" class="checkbox selectAll" value="">Select All</label>
              </div>
          </div>
          <div class="form-group">
              <div class="col-sm-12 ">
                <label><input type="checkbox" class="checkbox" value="">CHS Informed Consent Form</label>
              </div>
              <hr/>
              <div class="col-sm-12">
                <label><input type="checkbox" class="checkbox" value="">Order Sets</label>
              </div>
              <div class="col-sm-12">
                <label><input type="checkbox" class="checkbox" value="">Carboplatin Teaching Sheet</label>
              </div>
              <div class="col-sm-12">
                <label><input type="checkbox" class="checkbox" value="">Bevacizumab Teaching Sheet</label>
              </div>
              <div class="col-sm-12">
                <label><input type="checkbox" class="checkbox" value="">CHS Specialty Pharmacy Sheet</label>
              </div>
              <div class="col-sm-12">
                <label><input type="checkbox" class="checkbox" value="">Calendar</label>
              </div>
              <div class="col-sm-12">
                <label><input type="checkbox" class="checkbox" value="">Healthcare Provider Contact Form</label>
              </div>
          </div>
          <div class="form-group">
              <div class="col-sm-12">
              <button type="submit" class="btn btn-default submit">Generate Super Pack</button>
            </div>
          </div>

        </form>

And the next jquery code:

This toggle the styles

$('.checkbox').checkbox({
    buttonStyle: 'btn-link',
    buttonStyleChecked: 'btn-inverse',
    uncheckedClass: 'icon-check-empty',
    checkedClass: 'btn-inverse'
});

If I want to check all boxes I use: 

$(".selectAll").click(function () {
    $('input:checkbox').not(this).prop('checked', this.checked);
});

But my problem is, when I have one or more item selected and then I choose select All the checked items go unchecked. I'm using bootstrap-checkbox.js
But I can not figure out how solve the problem.

Any idea?

Thank you.

user3258974
  • 3
  • 1
  • 2

1 Answers1

2

You can use checkbox options to enable/disable them all

$('input:checkbox').not(this).checkbox({checked: this.checked});

http://jsfiddle.net/D2RLR/7108/

  • please check http://stackoverflow.com/questions/32266101/uncheck-table-row-in-bootstrap-table-on-specific-condition – Vilas Aug 31 '15 at 10:26
  • This isn't working for me. It is saying "checkbox is not a function" any idea what I am doing wrong? – KirstieBallance Jun 15 '18 at 21:01
  • 1
    @KirstieBallance this question/answer was about a bootstrap plugin. The original post has the solution on how to do it in pure jQuery `$('input:checkbox').not(this).prop('checked', this.checked);` –  Jun 18 '18 at 13:01