parallax background

Ext JS 4 – TextField and Enter event

Digital Transformation Group LinkedIn
Running Tomcat on HTTPS with a Secure Certificate on Dreamhost
August 1, 2012
Digital Transformation Group LinkedIn
Ext JS Dynamic Image Refresh and Load
August 27, 2012

We come across this often when developing new Ext JS applications with a login panel. How do you capture the ‘Enter’ keypress to authenticate.

Here is the code:

Ext.define('MyApp.view.MyContainer', {
    extend: 'Ext.container.Container',

    height: 250,
    width: 400,

    initComponent: function() {
        var me = this;

        Ext.applyIf(me, {
            items: [
                {
                    xtype: 'textfield',
                    fieldLabel: 'Login',
		    listeners: {
	             	specialkey: function(f,e){
			    if (e.getKey() == e.ENTER) {
			        me.enterHandler();
			    }
		        }
	            }
                }
            ]
        });
        me.callParent(arguments);
    },
    enterHandler:function(){
        Ext.Msg.alert('Enter Pressed');
    }
});

Comments are closed.

//]]>