]> git.proxmox.com Git - pve-manager.git/commitdiff
ui: ComboBoxSetStoreNode: don't hide the picker when clicking the toolbar
authorDominik Csapak <d.csapak@proxmox.com>
Fri, 27 Jan 2023 10:14:36 +0000 (11:14 +0100)
committerThomas Lamprecht <t.lamprecht@proxmox.com>
Tue, 31 Jan 2023 09:38:11 +0000 (10:38 +0100)
When clicking the toolbar of the ComboGrid, the combobox loses focus,
and instantly hides the picker.

To prevent that, we keep track of the mousedown event on the toolbar
(which happily comes before the focusLeave event), and prevent the
focusLeave propagation in that case.

Then on mouseup, we focus the combobox again, so that the nexct
focusLeave can trigger again.

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
www/manager6/form/ComboBoxSetStoreNode.js

index a654636b74acc38999d4a0f5d9a0b75cce979de9..a127af3a5160ad8ac1a405b7a83c539d1183f78e 100644 (file)
@@ -29,6 +29,30 @@ Ext.define('PVE.form.ComboBoxSetStoreNode', {
        me.fireEvent('nodechanged', value);
     },
 
+    tbarMouseDown: function() {
+       this.mousePressed = true;
+    },
+
+    tbarMouseUp: function() {
+       let me = this;
+       delete this.mousePressed;
+       if (me.focusLeft) {
+           me.focus();
+           delete me.focusLeft;
+       }
+    },
+
+    // conditionally prevent the focusLeave handler to continue, preventing collapsing of the picker
+    onFocusLeave: function() {
+       let me = this;
+       me.focusLeft = true;
+       if (!me.mousePressed) {
+           me.callParent(arguments);
+       }
+
+       return undefined;
+    },
+
     initComponent: function() {
        let me = this;
 
@@ -37,6 +61,12 @@ Ext.define('PVE.form.ComboBoxSetStoreNode', {
            Ext.apply(me.listConfig ?? {}, {
                tbar: {
                    xtype: 'toolbar',
+                   listeners: {
+                       mousedown: me.tbarMouseDown,
+                       mouseup: me.tbarMouseUp,
+                       element: 'el',
+                       scope: me,
+                   },
                    items: [
                        {
                            xtype: "pveStorageScanNodeSelector",