PDA

View Full Version : [2.0rc1] NumberField with support for external update function



sw45859
2 Dec 2007, 9:04 AM
hi, i'm new to these forums and kinda to ext as well. awesome library first off.

this section of code is meant to be added to the ext-all.js file, it allows you to set up an external function to update another text field or whatever you want to do in that function, i'm sure it's easily done with TextField as well but i needed it for a number field so that's what i'm posting :D.

it supports every configuration that the NumberField supports so it's all the same setup with the addition of the "updateFunction" setting.


new Ext.form.NumberFieldTwin({
name: 'name',
id: 'name',
updateFunction: {your external function name}
});



Ext.form.NumberFieldTwin=Ext.extend(Ext.form.NumberField, {
updateFunction: null,
initEvents:function(){
Ext.form.NumberFieldTwin.superclass.initEvents.call(this);
var B=this.baseChars+"";
if(this.allowDecimals){
B+=this.decimalSeparator
}
if(this.allowNegative){B+="-"}
this.stripCharsRe=new RegExp("[^"+B+"]","gi");
var A=function(D){
var C=D.getKey();
if(!Ext.isIE&&(D.isSpecialKey()||C==D.BACKSPACE||C==D.DELETE)){return }
var E=D.getCharCode();
if(B.indexOf(String.fromCharCode(E))===-1){D.stopEvent()}
this.updateFunction();
};
this.el.on("keyup",A,this)
},
});

brian.moeskau
2 Dec 2007, 9:30 AM
If your goal is to provide that functionality on your own instances of NumberField, there is no need to subclass. Just override initEvents using Ext.override.

Also, don't ever use ext-all.js for the purpose of extending code. Use ext-all-debug.js, or better yet, the actual source class. Variable names like A and B aren't too meaningful.

There is no need to declare your update function. JS is dynamic, so all you need to do is set it from code, or pass it in as a config option, and it will be available.

(Also, you have a trailing comma after initEvents in your code, which will blow up IE.)

Here's how I would approach it (untested):


Ext.override(Ext.form.NumberField, {
initEvents : function(){
Ext.form.NumberField.superclass.initEvents.call(this);
var allowed = this.baseChars+'';
if(this.allowDecimals){
allowed += this.decimalSeparator;
}
if(this.allowNegative){
allowed += "-";
}
this.stripCharsRe = new RegExp('[^'+allowed+']', 'gi');
var keyPress = function(e){
var k = e.getKey();
if(!Ext.isIE && (e.isSpecialKey() || k == e.BACKSPACE || k == e.DELETE)){
return;
}
var c = e.getCharCode();
if(allowed.indexOf(String.fromCharCode(c)) === -1){
e.stopEvent();
}
if(this.updateFunction){
this.updateFunction();
}
};
this.el.on("keypress", keyPress, this);
}
});

sw45859
2 Dec 2007, 4:12 PM
ok i did some testing and found some issues i didn't test for before, a little quick to post it :P

thanks for the response and i'll be sure to follow that for other things i might add, still learning so be gentle lol



Ext.override(Ext.form.NumberField, {
initEvents : function(){
Ext.form.NumberField.superclass.initEvents.call(this);
var allowed = this.baseChars+'';
if(this.allowDecimals){
allowed += this.decimalSeparator;
}
if(this.allowNegative){
allowed += "-";
}
this.stripCharsRe = new RegExp('[^'+allowed+']', 'gi');
var keyPress = function(e){
var k = e.getKey();
if(!Ext.isIE && (e.isSpecialKey() || k == e.BACKSPACE || k == e.DELETE)){
return;
}
var c = e.getCharCode();
if(allowed.indexOf(String.fromCharCode(c)) === -1){
e.stopEvent();
}
};
this.el.on("keypress", keyPress, this);

if (this.updateFunction){
var keyUp = function (e){
this.updateFunction();
}
this.el.on("keyup", keyUp, this);
}
}
});