Et2Select: Always close the dropdown after an option is selected, even if multiple=true

This commit is contained in:
nathan 2023-03-23 15:23:32 -06:00
parent 82ee38fffe
commit 62402f39ae

View File

@ -251,6 +251,7 @@ export class Et2Select extends Et2WithSearchMixin(Et2WidgetWithSelect)
this._handleMouseWheel = this._handleMouseWheel.bind(this); this._handleMouseWheel = this._handleMouseWheel.bind(this);
this._handleMouseEnter = this._handleMouseEnter.bind(this); this._handleMouseEnter = this._handleMouseEnter.bind(this);
this._handleMouseLeave = this._handleMouseLeave.bind(this); this._handleMouseLeave = this._handleMouseLeave.bind(this);
this.handleOptionClick = this.handleOptionClick.bind(this);
this.handleTagRemove = this.handleTagRemove.bind(this); this.handleTagRemove = this.handleTagRemove.bind(this);
} }
@ -266,6 +267,7 @@ export class Et2Select extends Et2WithSearchMixin(Et2WidgetWithSelect)
this.addEventListener("mousewheel", this._handleMouseWheel); this.addEventListener("mousewheel", this._handleMouseWheel);
this.addEventListener("mouseenter", this._handleMouseEnter); this.addEventListener("mouseenter", this._handleMouseEnter);
this.addEventListener("mouseup", this.handleOptionClick);
this.updateComplete.then(() => this.updateComplete.then(() =>
{ {
@ -668,6 +670,25 @@ export class Et2Select extends Et2WithSearchMixin(Et2WidgetWithSelect)
} }
} }
/**
* Always close the dropdown if an option is clicked, even if multiple=true. This differs from SlSelect,
* which leaves the dropdown open for multiple=true
*
* @param {MouseEvent} event
* @private
*/
private handleOptionClick(event : MouseEvent)
{
this.dropdown.hide().then(() =>
{
if(typeof this.handleMenuHide == "function")
{
// Make sure search gets hidden
this.handleMenuHide();
}
});
}
/** /**
* Get the icon for the select option * Get the icon for the select option
* *