From 381031925fb52dc0efb508334c5365b2251fffd0 Mon Sep 17 00:00:00 2001
From: Patrizio Bekerle <patrizio@bekerle.com>
Date: Wed, 4 Nov 2020 11:21:46 +0100
Subject: [PATCH] Fix issue that causes select2 to close immediately after
opening
---
packages/person-select/src/person-select.js | 22 ++++++++++++---------
1 file changed, 13 insertions(+), 9 deletions(-)
diff --git a/packages/person-select/src/person-select.js b/packages/person-select/src/person-select.js
index 05abc17d..a9a5d9dc 100644
--- a/packages/person-select/src/person-select.js
+++ b/packages/person-select/src/person-select.js
@@ -80,15 +80,11 @@ export class PersonSelect extends ScopedElementsMixin(LitElement) {
this.updateComplete.then(()=>{
that.$select = that.$('#' + that.selectId);
- // close the selector on blur of the web component
- $(that).blur(() => {
- // the 500ms delay is a workaround to actually get an item selected when clicking on it,
- // because the blur gets also fired when clicking in the selector
- setTimeout(() => {
- if (this.select2IsInitialized()) {
- that.$select.select2('close');
- }
- }, 500);
+ // Close the popup when clicking outside of select2
+ document.addEventListener('click', (ev) => {
+ if (!ev.composedPath().includes(this)) {
+ this._closeSelect2();
+ }
});
// try an init when user-interface is loaded
@@ -96,6 +92,14 @@ export class PersonSelect extends ScopedElementsMixin(LitElement) {
});
}
+ _closeSelect2() {
+ const $select = this.$('#' + this.selectId);
+ console.assert($select.length, "select2 missing");
+ if (this.select2IsInitialized($select)) {
+ $select.select2('close');
+ }
+ }
+
initJSONLD(ignorePreset = false) {
const that = this;
--
GitLab