PDA

View Full Version : [OPEN-1412] Handling specialKey events for TextField (another way)



dfa
26 Nov 2010, 7:57 AM
We implement a special number field, which should be usable very comfortable. Due to these proposals we are dependent on a correct specialKey event handling. In the actual Ext version (3.3) there is a different event handling according to which browser you use.

Our investigations point to following:


Chrome: Sends only keyDown when pressing a special key
Firefox: Sends keyDown and keyPress when pressing a special key
InternetExplorer: Send keyDown when pressing a special key
Opera: Sends keyDown and keyPress when pressing a special key. Sometimes (e.g. '-' on number block) it sends a keyDown event followed by two (yes two!) keyPress events. :((


We tried to solve this problem that way:


Ext.override(Ext.form.TextField, {
keyDownCode:'',

onKeyDown:function(e){
var charCode = e.charCode ? e.charCode : e.keyCode;
this.keyDownCode = charCode;
this.fireEvent('keydown', this, e);
if (Ext.isGecko === false && Ext.isOpera === false) {
if ((charCode === 8) ||
(charCode === 9) ||
(charCode === 13) ||
(charCode === 127) ||
(charCode >= 33 && charCode <= 40) ||
(charCode >= 44 && charCode <= 46)) {
this.fireEvent('specialkey', this, e);
this.keyDownCode = '';
return;
}
}
},

onKeyPress:function(e){
var charCode = e.charCode ? e.charCode : e.keyCode;
if (Ext.isGecko === true || Ext.isOpera === true) {
if (charCode === this.keyDownCode) {
this.keyDownCode = '';
if (Ext.isOpera === true && e.browserEvent.which > 0) {
// Opera sends keys like '-' in the number block as
// 'keydown, keypress, keypress' sequence. The first
// sequence 'keydown, keypress' has to be ignored.
return;
}
this.fireEvent('specialkey', this, e);
return;
}
}
this.fireEvent('keypress', this, e);
}

});

If you - the ExtJs development team - think this is a way, feel free to integrate it.

Best regards,
Dom

dfa
29 Nov 2010, 11:45 PM
Oops, I forgot three lines of code:


Ext.override(Ext.form.Field, {
fireKey:function(e){
}
});


We have to deactivate the fireKey event.

dfa
30 Nov 2010, 1:16 AM
Sorry for these multiple updates. The actual version:


Ext.override(Ext.form.Field, {
fireKey:function(e){
}
});

Ext.override(Ext.form.TextField, {
keyDownCode:'',

isSpecialKey:function(keyCode){
if (this.isSpecialKeyNonPrintable(keyCode) === true) {
return true;
}
return this.isSpecialKeyPrintable(keyCode);
},

isSpecialKeyNonPrintable:function(keyCode){
return ((keyCode === 8) ||
(keyCode === 9) ||
(keyCode === 13) ||
(keyCode === 127));

},

isSpecialKeyPrintable:function(keyCode){
return ((keyCode >= 33 && keyCode <= 40) ||
(keyCode >= 44 && keyCode <= 46));
},

onKeyDown:function(e){
var charCode = e.charCode ? e.charCode : e.keyCode;
this.keyDownCode = charCode;
this.fireEvent('keydown', this, e);
if (Ext.isGecko === false && Ext.isOpera === false) {
if (this.isSpecialKey(charCode) === true) {
this.fireEvent('specialkey', this, e);
this.keyDownCode = '';
return;
}
}
},

onKeyPress:function(e){
var charCode = e.charCode ? e.charCode : e.keyCode;
if (Ext.isGecko === true || Ext.isOpera === true) {
if ((charCode === this.keyDownCode) &&
(this.isSpecialKey(charCode) === true)) {
this.keyDownCode = '';
if (Ext.isOpera === true && e.browserEvent.which > 0 && this.isSpecialKeyPrintable(charCode) === true) {
// Opera sends keys like '-' in the number block as
// 'keydown, keypress, keypress' sequence. The first
// sequence 'keydown, keypress' has to be ignored.
return;
}
this.fireEvent('specialkey', this, e);
return;
}
}
this.fireEvent('keypress', this, e);
}

});