diff --git a/js/button.js b/js/button.js index 8716aff4f6ff3792f35b29a3cda5fedab792e745..3e2e345127ab6c085f6fc10f2355719561ad2e29 100644 --- a/js/button.js +++ b/js/button.js @@ -57,14 +57,18 @@ var $input = this.$element.find('input') if ($input.prop('type') == 'radio') { if ($input.prop('checked')) changed = false - if (!$input.prop('checked') || !this.$element.hasClass('active')) $parent.find('.active').removeClass('active') + $parent.find('.active').removeClass('active') + this.$element.addClass('active') + } else if ($input.prop('type') == 'checkbox') { + if (($input.prop('checked')) !== this.$element.hasClass('active')) changed = false + this.$element.toggleClass('active') } - if (changed) $input.prop('checked', !this.$element.hasClass('active')).trigger('change') + $input.prop('checked', this.$element.hasClass('active')) + if (changed) $input.trigger('change') } else { this.$element.attr('aria-pressed', !this.$element.hasClass('active')) + this.$element.toggleClass('active') } - - if (changed) this.$element.toggleClass('active') } @@ -107,7 +111,7 @@ var $btn = $(e.target) if (!$btn.hasClass('btn')) $btn = $btn.closest('.btn') Plugin.call($btn, 'toggle') - if (!$(e.target).is('input[type="radio"]')) e.preventDefault() + if (!($(e.target).is('input[type="radio"]') || $(e.target).is('input[type="checkbox"]'))) e.preventDefault() }) .on('focus.bs.button.data-api blur.bs.button.data-api', '[data-toggle^="button"]', function (e) { $(e.target).closest('.btn').toggleClass('focus', /^focus(in)?$/.test(e.type)) diff --git a/js/tests/unit/button.js b/js/tests/unit/button.js index ed7b248d4aaa18a7944fe344b438cbde2e18153c..691796c42885b376ac4f309d7b19862bf125da44 100644 --- a/js/tests/unit/button.js +++ b/js/tests/unit/button.js @@ -130,19 +130,6 @@ $(function () { assert.strictEqual($btn.attr('aria-pressed'), 'true', 'btn aria-pressed state is true') }) - QUnit.test('should toggle active when btn children are clicked within btn-group', function (assert) { - assert.expect(2) - var $btngroup = $('<div class="btn-group" data-toggle="buttons"/>') - var $btn = $('<button class="btn">fat</button>') - var $inner = $('<i/>') - $btngroup - .append($btn.append($inner)) - .appendTo('#qunit-fixture') - assert.ok(!$btn.hasClass('active'), 'btn does not have active class') - $inner.trigger('click') - assert.ok($btn.hasClass('active'), 'btn has class active') - }) - QUnit.test('should check for closest matching toggle', function (assert) { assert.expect(12) var groupHTML = '<div class="btn-group" data-toggle="buttons">'