mirror of
https://github.com/twbs/bootstrap.git
synced 2025-02-19 16:54:24 +01:00
Merge pull request #16404 from patrickhlauke/radio-checkbox-kbd-toggle-fix
Fix radio and checkbox keyboard handling in .btn-group
This commit is contained in:
commit
a254782ca4
14
js/button.js
14
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))
|
||||
|
@ -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">'
|
||||
|
Loading…
x
Reference in New Issue
Block a user