View Full Version : e.getKey() is undefined in specialkey handler for numberfield

10 Feb 2011, 3:53 PM
I am trying to get the specialkey event handler working in a NumberField. However, the getKey() function is returning 'undefined'. Moreover, inspecting the underlying browser event (using Firebug), it appears what e really is, is a 'mouseout' event. So I'm not sure what is going on. I tried in both FF 3.5 and IE7, and getting the same problem in both.

ExtJS version is 3.2.2. Relevant snippet below, I can provide more context if needed. Thank you.

//Ext.ux.ImageButton from here: http://www.sencha.com/forum/showthread.php?2587-ImageButton-%28extension-of-Ext.Button%29&
var recordIDSearchButton = new Ext.ux.ImageButton({
itemId: 'recordIDSearchButton',
imgPath: '/my/image.png',
flex: 1,
imgWidth: 18,
imgHeight: 18,
width: 18,
height: 18,
handler: function(button,eventObj) {
location.href = '/recordIDSearch/'+recordIDSearchField.getValue();

var recordIDSearchField = new Ext.form.NumberField({
//xtype: 'textfield',
itemId: 'recordIDSearchField',
enableKeyEvents: true,
flex: 1,
listeners: {
specialkey: function(field,e) {
//this is where the problem lies; e.getKey() is returning undefined
if (e.getKey() == Ext.EventObject.ENTER) {

var recordSearchFormPanel = new Ext.Container({
layout: 'hbox',
layoutConfig: {
align: 'middle'
width: 150,
items: [{xtype: 'displayfield',value:'Go to record ID',cls:'record-id-search-label'},{xtype: 'spacer', width: 5},recordIDSearchField,{xtype: 'spacer', width: 5},recordIDSearchButton]


17 Feb 2011, 10:39 AM
Has nobody else seen this problem occur? Any ideas at all would be appreciated, including shots in the dark.

17 Feb 2012, 6:38 AM
To capture keyboard events you must set the enableKeyEvents property on the component to true. The e.getKey() and the e.getCharCode() are working fine...please use 'F8' to get to the next breakpoint, to continue testing with firebug, do not move your mouse that's why you are getting the 'mouseout' event, you need to have the 'keyup' event...