Magento dropdownDialog widget is a customization of the standard jQuery UI Dialog. As extra functionality it implements the following:
- triggering event for opening
- delaying to automatically close the drop-down on mouse out
- clicking outside the area closes the drop-down
The dropdownDialog widget source is located in lib/web/mage/dropdown.js.
Initialize the dropdownDialog widget
For information about how to initialize a widget in a JS component or
Magento customized Dialog widget has default Query UI Dialog widget options, plus several custom options:
Description of each option follows.
Specifies if the
position option is used for calculating the drop-down offset.
If set to
false (default value), then
position rules are not used and the drop-down is positioned under the element for which the widget is initialized. Otherwise the drop-down offset is calculated using the
Specifies if the drop-down is closed when mouse pointer is moved out.
Specifies if the drop-down is closed on mouse click outside the drop-down.
Defines if the title option is used for displaying the title bar.
Class that is added to the drop-down, when it gets initialized.
Class that is added/removed on drop-down content when it gets opened/closed.
Class that is added/removed for the dropdown parent, when the drop-down gets opened/closed.
Class that is added/removed on the trigger element when the drop-down gets opened/closed.
Name of the event that triggers the
open() function for drop-down.
Element that triggers the drop-down.
- jQuery object
The number of milliseconds until the dropdown is closed after mouse pointer moves out.
Default value: 500
Magento customized dropdownDialog widget has default Query UI Dialog widget methods, though some of them are customized.
Customized public methods:
Beside default functionality, this method calls the
_mouseEnter() functions, adds classes on trigger and drop-down parent, and binds the close on mouse click outside drop-down to the
Beside default functionality, this method removes the classes from trigger and drop-down parent and clears the timeout if the latter exists.