Changing config property does not effect?

[link41489]

Hi,

I'm new to Ext-js and am still learning. My question is, I have a xtype "NumberField" which has the config property "allowDecimals" set to false when the object is created. The reason why the field is set to false is because depending on what the user selects (i.e cost or quantity) the field should allow and not allow the use of decimals. I've found on the form that some config properties are only readable but looking at the doc for the "allowDecimals" config property, its not. So, while debugging in Chrome, I've tried calling:

Ext.apply(numField, {allowDecimals: true}) and I can see after the call that the property is changed but yet the field does not allow me to enter decimal values. However, in my code, when the numberfield is created, if I set the allowDecimal to true, it does allow me to enter decimals values but then brings up the issue of not allowing decimal input when the user selects "Quantity".

If anyone can direct me to a source or give me some insight on this, I would greatly appreciate it.

Thanks!

[tvanzoelen]

Its done in the initComponent of the NumberField



initComponent: function() {
var me = this,
allowed;

me.callParent();

me.setMinValue(me.minValue);
me.setMaxValue(me.maxValue);

// Build regexes for masking and stripping based on the configured options
if (me.disableKeyFilter !== true) {
allowed = me.baseChars + '';
if (me.allowDecimals) {
allowed += me.decimalSeparator;
}
if (me.minValue < 0) {
allowed += '-';
}
allowed = Ext.String.escapeRegex(allowed);
me.maskRe = new RegExp('[' + allowed + ']');
if (me.autoStripChars) {
me.stripCharsRe = new RegExp('[^' + allowed + ']', 'gi');
}
}
},



Maybe you can make a function for it



var allowDecimalsFunc = function(numberField, allowDecimals) {
var me = numberField,
allowed;

me.allowDecimals = allowDecimals;

// Build regexes for masking and stripping based on the configured options
if (me.disableKeyFilter !== true) {
allowed = me.baseChars + '';
if (me.allowDecimals) {
allowed += me.decimalSeparator;
}
if (me.minValue < 0) {
allowed += '-';
}
allowed = Ext.String.escapeRegex(allowed);
me.maskRe = new RegExp('[' + allowed + ']');
if (me.autoStripChars) {
me.stripCharsRe = new RegExp('[^' + allowed + ']', 'gi');
}
}
}


I didn't test it...but you must rebuild the regex.

[link41489]

@tvanzoelen (http://www.sencha.com/forum/member.php?32684-tvanzoelen)

Thanks! I had to do some slight modifications but what you suggested works.

Question though, I understand that usually there are getters/setters to configure properties, but for this particular instance, since there isn't any getters/setters for the config property allowDecimals, why was this approach needed even though having a line like this would change the property:

numField.allowDecimals = true;
or
Ext.apply(numField, {allowDecimals: true});

I know you mentioned because its done in the initComponent component of NumberField and I took a look at the source as well and see that now. Looking at the code you posted, it looks like we need to construct a new string of valid characters. I'm just trying to understand the material and try to understand why its done the way it is.

Any thoughts, insight is appreciate.

Thanks everyone.

[tvanzoelen]

There are no getters and setters for this thing yet, I suppose. But probably they will come. Nice feature request.

You had to rebuild the regex, that string of valid characters you must recompile in the regex, else you destroy other functonalities.