PDA

View Full Version : Can't catch ENTER on textArea (specialkeys).



TotoTitus
16 Aug 2010, 6:45 AM
Hello,

I have the following code:


Ext.namespace('goodTalk.talkWindow');

goodTalk.talkWindow = Ext.extend(Ext.Window, {
constructor: function (username) {
goodTalk.talkWindow.superclass.constructor.call(this, {
id: 'talk' + username,
title: username,
constrain: true,
enableKeyEvents: true,
renderTo: 'chat-area',
height: 350,
width: 500,
style: 'padding: 5px 0 0 5px; font-size: 11px;',
items: [{
xtype: 'displayfield',
style: 'padding: 0 0 2px',
value: 'Talk:'
},{
xtype: 'textarea',
itemId: 'talkBox',
height: 130,
width: 475,
autoScroll: true,
readOnly: true
},{
xtype: 'displayfield',
style: 'padding 0 0 2px',
value: 'Say:'
},{
xtype: 'textarea',
itemId: 'sendBox',
style: 'top: 175px; left: 5px;',
height: 85,
value: 'bla',
width: 475,
listeners: {
specialkey: function(f, e) { Ext.Msg.alert('hey', 'hey');/*
if(e.getKey() == e.ENTER) {
SEND_MESSAGE(this.getValue(), username);
}
this.setValue("");*/
}
}
}]
});
}
});

I extended the window class to suite my needs. There's some comments there, that's the original code i intended, but i commented it out to make some tests.

Seems like the specialkey event does not fire when i press 'Enter'. Though it does fire on other keys (arrows, pgup, pgdown etc). Has anyone of you encountered this before? I really need 'enter' to be caught by the event. (the commented code reveals this; that's an AJAX call, which should be triggered by enter).
Thank you.

TotoTitus
17 Aug 2010, 2:13 PM
bump !

Condor
18 Aug 2010, 2:55 AM
Enter is not a special key.

You will have to configure the textarea with enableKeyEvents:true and use the keydown or keypress event.

TotoTitus
18 Aug 2010, 4:24 AM
Been there, done that i fear :(
It doesn't work :(



Ext.namespace('goodTalk.talkWindow');

goodTalk.talkWindow = Ext.extend(Ext.Window, {
constructor: function (username) {
goodTalk.talkWindow.superclass.constructor.call(this, {
id: 'talk' + username,
title: username,
constrain: true,
enableKeyEvents:true,
renderTo: 'chat-area',
height: 350,
width: 500,
style: 'padding: 5px 0 0 5px; font-size: 11px;',
items: [{
xtype: 'displayfield',
style: 'padding: 0 0 2px',
value: 'Talk:'
},{
xtype: 'textarea',
itemId: 'talkBox',
height: 130,
width: 475,
autoScroll: true,
readOnly: true
},{
xtype: 'displayfield',
style: 'padding 0 0 2px',
value: 'Say:'
},{
xtype: 'textarea',
itemId: 'sendBox',
style: 'top: 175px; left: 5px;',
height: 85,
value: 'bla',
width: 475,
listeners: {
keypress: function(f, e) { Ext.Msg.alert('hey', 'hey');/*
if(e.getKey() == e.ENTER) {
SEND_MESSAGE(this.getValue(), username);
}
this.setValue("");*/
}
}
}]
});
}
});

For some reason, it refuses to catch the event on any key, not just enter.
And on specialkeys: Textarea extends Textfield, and Textfield catches enter on specialkeys. The API documentation lists 'enter' as a special key.
Nonetheless, it does not work for me in any way :(.

Condor
18 Aug 2010, 4:30 AM
You didn't specify enableKeyEvents:true!

TotoTitus
18 Aug 2010, 4:54 AM
You are so right, i was specifying them for the WINDOW, not for the Textarea !!!
Thank you, thank you for your patience !