1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-07 22:26:57 +02:00

Dropdown — Emit events on the .dropdown-toggle button (#32625)

* Emit events on the dropdown button

Emit the events on `.dropdown-toggle` button and then bubble up

* Add migration note for events

* Update the docs for events

* Add unit test to check the event bubbling

Co-authored-by: XhmikosR <xhmikosr@gmail.com>
This commit is contained in:
Rohit Sharma
2021-02-04 01:21:19 +05:30
committed by GitHub
parent 02d103be91
commit 3770b7b9e3
4 changed files with 106 additions and 112 deletions

View File

@@ -194,7 +194,7 @@ class Dropdown extends BaseComponent {
this._menu.classList.toggle(CLASS_NAME_SHOW)
this._element.classList.toggle(CLASS_NAME_SHOW)
EventHandler.trigger(parent, EVENT_SHOWN, relatedTarget)
EventHandler.trigger(this._element, EVENT_SHOWN, relatedTarget)
}
hide() {
@@ -202,12 +202,11 @@ class Dropdown extends BaseComponent {
return
}
const parent = Dropdown.getParentFromElement(this._element)
const relatedTarget = {
relatedTarget: this._element
}
const hideEvent = EventHandler.trigger(parent, EVENT_HIDE, relatedTarget)
const hideEvent = EventHandler.trigger(this._element, EVENT_HIDE, relatedTarget)
if (hideEvent.defaultPrevented) {
return
@@ -219,7 +218,7 @@ class Dropdown extends BaseComponent {
this._menu.classList.toggle(CLASS_NAME_SHOW)
this._element.classList.toggle(CLASS_NAME_SHOW)
EventHandler.trigger(parent, EVENT_HIDDEN, relatedTarget)
EventHandler.trigger(this._element, EVENT_HIDDEN, relatedTarget)
}
dispose() {
@@ -383,7 +382,6 @@ class Dropdown extends BaseComponent {
const toggles = SelectorEngine.find(SELECTOR_DATA_TOGGLE)
for (let i = 0, len = toggles.length; i < len; i++) {
const parent = Dropdown.getParentFromElement(toggles[i])
const context = Data.getData(toggles[i], DATA_KEY)
const relatedTarget = {
relatedTarget: toggles[i]
@@ -409,7 +407,7 @@ class Dropdown extends BaseComponent {
continue
}
const hideEvent = EventHandler.trigger(parent, EVENT_HIDE, relatedTarget)
const hideEvent = EventHandler.trigger(toggles[i], EVENT_HIDE, relatedTarget)
if (hideEvent.defaultPrevented) {
continue
}
@@ -429,7 +427,7 @@ class Dropdown extends BaseComponent {
dropdownMenu.classList.remove(CLASS_NAME_SHOW)
toggles[i].classList.remove(CLASS_NAME_SHOW)
EventHandler.trigger(parent, EVENT_HIDDEN, relatedTarget)
EventHandler.trigger(toggles[i], EVENT_HIDDEN, relatedTarget)
}
}