konevsa/proxmox-widget-toolkit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ComboGrid: open picker also when focusing an editable field

Browse Source 
port commit
851c032d69ad5ae23725dd1add9e4084ebc12650
from pve-manager

commit message:

    ComboBoxes provided by UI frameworks normally show their selection
    possibilities once focused, ExtJS does this too but not on editable
    (and thus filterable) input fields. Add a logic which allows this too
    and streamlines the behavior of ComboGrid/Box like components.

    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@proxmox.com>
This commit is contained in:
Dominik Csapak 2018-01-08 13:03:00 +01:00
parent 3ab80554c6
commit 39d9914990
1 changed files with 23 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
form/ComboGrid.js
View File

@ -272,6 +272,29 @@ Ext.define('Proxmox.form.ComboGrid', {
me.createPicker();
}
if (me.editable) {
// The trigger.picker causes first a focus event on the field then
// toggles the selection picker. Thus skip expanding in this case,
// else our focus listner expands and the picker.trigger then
// collapses it directly afterwards.
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;