[pve-devel] [PATCH manager 3/3] ComboGrid: open picker on input field focus

[Thomas Lamprecht]

ComboBoxes provided by UI frameworks normally show their selection
possibilities once focused, change the behavior of COmboGrid that it
does this too.

To avoid a glitch, where clicking the "picker trigger" (the down
arrow which normally toggles the selection picker) would first focus
the element - thus expanding it - and only then causing a toggle
which collapses it again, we overwrite the 'Ext.form.trigger.Trigger'
onMouseDown so that we can skip a expansion on this event.

Signed-off-by: Thomas Lamprecht <t.lamprecht at proxmox.com>
---
 www/manager6/form/ComboGrid.js | 21 +++++++++++++++++++++
 1 file changed, 21 insertions(+)

diff --git a/www/manager6/form/ComboGrid.js b/www/manager6/form/ComboGrid.js
index fbc318e5..b9e5e430 100644
--- a/www/manager6/form/ComboGrid.js
+++ b/www/manager6/form/ComboGrid.js
@@ -274,6 +274,27 @@ Ext.define('PVE.form.ComboGrid', {
             me.createPicker();
         }
 
+	// the trigger.Trigger.onMouseDown causes a focus event on us, so we
+	// expand the selection-picker and the trigger then toggles it directly
+	// back. Avoid this by telling our focus handler to skip expansion if
+	// focusing was caused by the trigger-picker
+	Ext.override(me.triggers.picker, {
+	    onMouseDown : function (e) {
+		// copied "should we focus" check from Ext.form.trigger.Trigger
+		if (e.pointerType !== 'touch' && !this.field.owns(Ext.Element.getActiveElement())) {
+		    me.skip_expand_on_focus = true;
+		}
+		this.callParent(arguments);
+	    }
+	});
+
+	me.on("focus", function(me) {
+	    if (!me.isExpanded && !me.skip_expand_on_focus) {
+		me.expand();
+	    }
+	    me.skip_expand_on_focus = false;
+	});
+
 	me.mon(me.store, 'beforeload', function() {
 	    if (!me.isDisabled()) {
 		me.enableLoadMask = true;
-- 
2.11.0