From 1b9baa0d98019eba187e65102959fff60d06538a Mon Sep 17 00:00:00 2001 From: "Patrick H. Lauke" Date: Fri, 3 Apr 2015 22:32:49 +0100 Subject: [PATCH 1/2] Don't preventDefault radio buttons as this breaks keyboard navigation for radio button toggles (see https://github.com/twbs/bootstrap/issues/16223) --- js/button.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/js/button.js b/js/button.js index 7c7c021f9..3b86f35d4 100644 --- a/js/button.js +++ b/js/button.js @@ -56,8 +56,8 @@ if ($parent.length) { var $input = this.$element.find('input') if ($input.prop('type') == 'radio') { - if ($input.prop('checked') && this.$element.hasClass('active')) changed = false - else $parent.find('.active').removeClass('active') + if ($input.prop('checked')) changed = false + if (!$input.prop('checked') || !this.$element.hasClass('active')) $parent.find('.active').removeClass('active') } if (changed) $input.prop('checked', !this.$element.hasClass('active')).trigger('change') } else { @@ -107,7 +107,7 @@ var $btn = $(e.target) if (!$btn.hasClass('btn')) $btn = $btn.closest('.btn') Plugin.call($btn, 'toggle') - e.preventDefault() + if (!$(e.target).is('input[type="radio"]')) 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)) From 66d71136e668cf7bc8a311299fad9b773b76285a Mon Sep 17 00:00:00 2001 From: "Patrick H. Lauke" Date: Sat, 11 Apr 2015 19:24:21 +0200 Subject: [PATCH 2/2] Fix existing radio button unit test --- js/tests/unit/button.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/js/tests/unit/button.js b/js/tests/unit/button.js index 02312ebaf..ed7b248d4 100644 --- a/js/tests/unit/button.js +++ b/js/tests/unit/button.js @@ -167,13 +167,13 @@ $(function () { assert.ok(!$btn2.find('input').prop('checked'), 'btn2 is not checked') $btn2.find('input').trigger('click') assert.ok(!$btn1.hasClass('active'), 'btn1 does not have active class') - assert.ok(!$btn1.find('input').prop('checked'), 'btn1 is checked') + assert.ok(!$btn1.find('input').prop('checked'), 'btn1 is not checked') assert.ok($btn2.hasClass('active'), 'btn2 has active class') assert.ok($btn2.find('input').prop('checked'), 'btn2 is checked') $btn2.find('input').trigger('click') // clicking an already checked radio should not un-check it assert.ok(!$btn1.hasClass('active'), 'btn1 does not have active class') - assert.ok(!$btn1.find('input').prop('checked'), 'btn1 is checked') + assert.ok(!$btn1.find('input').prop('checked'), 'btn1 is not checked') assert.ok($btn2.hasClass('active'), 'btn2 has active class') assert.ok($btn2.find('input').prop('checked'), 'btn2 is checked') })