Geek Answers Handbook

Make ExtJS input field a lost focus

I have a numberfield input that I want to lose when the user presses the enter key.

Here's the current configuration:

 { xtype: 'numberfield', minValue: 0, maxValue: 99999, hideTrigger: true, keyNavEnabled: false, mouseWheelEnabled: false, enableKeyEvents: true, listeners: { specialkey: function(f, e) { if (e.getKey() == e.ENTER) f.blur(); } } }

The specialkey handler works by calling blur() as expected, but the only result is that the caret disappears from the input (which indicates that the DOM text input element has been blurred). The field still has all the x-form-focus etc css classes, and examining the object shows that the private hasFocus property is still true.

Any suggestions?

I tried calling f.onBlur() explicitly after calling blur() , but that didn't matter.

(The btw field does not belong to the form, so there is no form to submit.)

+4
source share
2 answers

To fix. The problem is caused by strange behavior in the Ext.form.field.Trigger class, where they do not run 'triggerBlur()' when the regular function 'blur()' called. Very interesting:

 listeners: { specialkey: function(f, e) { if (e.getKey() == e.ENTER) { f.triggerBlur(); f.blur(); } } }
+3
source

This works for me:

 specialkey: function(field,events) { if (events.getKey() == events.ENTER) { var nextfld = field.nextSibling(); nextfld.focus(true,100); } }

specialkey is a component listener, for example textfield, textare, datefield, etc.,

events.getKey - Get user keyboard input

events.ENTER - I used this for this, it will work when "ENTER" on the keyboard

field.nextSibling - the field refers to the current component and the nextSibling property of the component to indicate who will be the next component

Finally, nextfld.focus focuses the next component

0
source

More articles:


All Articles