Improve previous selector for nested tabs

This commit is contained in:
Johann-S 2017-07-18 14:22:39 +02:00 committed by XhmikosR
parent edf90c1bc4
commit 2eb1e687bd
2 changed files with 18 additions and 9 deletions

View File

@ -45,6 +45,7 @@ const Tab = (($) => {
DROPDOWN : '.dropdown', DROPDOWN : '.dropdown',
NAV_LIST_GROUP : '.nav, .list-group', NAV_LIST_GROUP : '.nav, .list-group',
ACTIVE : '.active', ACTIVE : '.active',
ACTIVE_UL : '> li > .active',
DATA_TOGGLE : '[data-toggle="tab"], [data-toggle="pill"], [data-toggle="list"]', DATA_TOGGLE : '[data-toggle="tab"], [data-toggle="pill"], [data-toggle="list"]',
DROPDOWN_TOGGLE : '.dropdown-toggle', DROPDOWN_TOGGLE : '.dropdown-toggle',
DROPDOWN_ACTIVE_CHILD : '> .dropdown-menu .active' DROPDOWN_ACTIVE_CHILD : '> .dropdown-menu .active'
@ -87,7 +88,8 @@ const Tab = (($) => {
const selector = Util.getSelectorFromElement(this._element) const selector = Util.getSelectorFromElement(this._element)
if (listElement) { if (listElement) {
previous = $.makeArray($(listElement).find(Selector.ACTIVE)) const itemSelector = listElement.nodeName === 'UL' ? Selector.ACTIVE_UL : Selector.ACTIVE
previous = $.makeArray($(listElement).find(itemSelector))
previous = previous[previous.length - 1] previous = previous[previous.length - 1]
} }
@ -148,7 +150,13 @@ const Tab = (($) => {
// private // private
_activate(element, container, callback) { _activate(element, container, callback) {
const activeElements = callback ? $(container).children(Selector.ACTIVE) : $(container).find(Selector.ACTIVE) let activeElements
if (container.nodeName === 'UL') {
activeElements = $(container).find(Selector.ACTIVE_UL)
} else {
activeElements = $(container).children(Selector.ACTIVE)
}
const active = activeElements[0] const active = activeElements[0]
const isTransitioning = callback const isTransitioning = callback
&& Util.supportsTransitionEnd() && Util.supportsTransitionEnd()

View File

@ -182,13 +182,14 @@ $(function () {
assert.expect(2) assert.expect(2)
var done = assert.async() var done = assert.async()
var dropHTML = '<ul class="drop nav">' var dropHTML =
+ '<li class="dropdown"><a data-toggle="dropdown" href="#">1</a>' '<ul class="drop nav">'
+ '<ul class="dropdown-menu">' + ' <li class="dropdown"><a data-toggle="dropdown" href="#">1</a>'
+ '<li><a href="#1-1" data-toggle="tab">1-1</a></li>' + ' <ul class="dropdown-menu nav">'
+ '<li><a href="#1-2" data-toggle="tab">1-2</a></li>' + ' <li><a href="#1-1" data-toggle="tab">1-1</a></li>'
+ '</ul>' + ' <li><a href="#1-2" data-toggle="tab">1-2</a></li>'
+ '</li>' + ' </ul>'
+ ' </li>'
+ '</ul>' + '</ul>'
$(dropHTML) $(dropHTML)