3 * Copyright(c) 2006-2010 Sencha Inc.
5 * http://www.sencha.com/license
8 * @class Ext.form.NumberField
9 * @extends Ext.form.TextField
10 * Numeric text field that provides automatic keystroke filtering and numeric validation.
12 * Creates a new NumberField
13 * @param {Object} config Configuration options
16 Ext.form.NumberField = Ext.extend(Ext.form.TextField, {
18 * @cfg {RegExp} stripCharsRe @hide
21 * @cfg {RegExp} maskRe @hide
24 * @cfg {String} fieldClass The default CSS class for the field (defaults to "x-form-field x-form-num-field")
26 fieldClass: "x-form-field x-form-num-field",
29 * @cfg {Boolean} allowDecimals False to disallow decimal values (defaults to true)
34 * @cfg {String} decimalSeparator Character(s) to allow as the decimal separator (defaults to '.')
36 decimalSeparator : ".",
39 * @cfg {Number} decimalPrecision The maximum precision to display after the decimal separator (defaults to 2)
44 * @cfg {Boolean} allowNegative False to prevent entering a negative sign (defaults to true)
49 * @cfg {Number} minValue The minimum allowed value (defaults to Number.NEGATIVE_INFINITY)
51 minValue : Number.NEGATIVE_INFINITY,
54 * @cfg {Number} maxValue The maximum allowed value (defaults to Number.MAX_VALUE)
56 maxValue : Number.MAX_VALUE,
59 * @cfg {String} minText Error text to display if the minimum value validation fails (defaults to "The minimum value for this field is {minValue}")
61 minText : "The minimum value for this field is {0}",
64 * @cfg {String} maxText Error text to display if the maximum value validation fails (defaults to "The maximum value for this field is {maxValue}")
66 maxText : "The maximum value for this field is {0}",
69 * @cfg {String} nanText Error text to display if the value is not a valid number. For example, this can happen
70 * if a valid character like '.' or '-' is left in the field with no number (defaults to "{value} is not a valid number")
72 nanText : "{0} is not a valid number",
75 * @cfg {String} baseChars The base set of characters to evaluate as valid numbers (defaults to '0123456789').
77 baseChars : "0123456789",
80 * @cfg {Boolean} autoStripChars True to automatically strip not allowed characters from the field. Defaults to <tt>false</tt>
82 autoStripChars: false,
85 initEvents : function() {
86 var allowed = this.baseChars + '';
87 if (this.allowDecimals) {
88 allowed += this.decimalSeparator;
90 if (this.allowNegative) {
93 allowed = Ext.escapeRe(allowed);
94 this.maskRe = new RegExp('[' + allowed + ']');
95 if (this.autoStripChars) {
96 this.stripCharsRe = new RegExp('[^' + allowed + ']', 'gi');
99 Ext.form.NumberField.superclass.initEvents.call(this);
103 * Runs all of NumberFields validations and returns an array of any errors. Note that this first
104 * runs TextField's validations, so the returned array is an amalgamation of all field errors.
105 * The additional validations run test that the value is a number, and that it is within the
106 * configured min and max values.
107 * @param {Mixed} value The value to get errors for (defaults to the current field value)
108 * @return {Array} All validation errors for this field
110 getErrors: function(value) {
111 var errors = Ext.form.NumberField.superclass.getErrors.apply(this, arguments);
113 value = Ext.isDefined(value) ? value : this.processValue(this.getRawValue());
115 if (value.length < 1) { // if it's blank and textfield didn't flag it then it's valid
119 value = String(value).replace(this.decimalSeparator, ".");
122 errors.push(String.format(this.nanText, value));
125 var num = this.parseValue(value);
127 if (num < this.minValue) {
128 errors.push(String.format(this.minText, this.minValue));
131 if (num > this.maxValue) {
132 errors.push(String.format(this.maxText, this.maxValue));
138 getValue : function() {
139 return this.fixPrecision(this.parseValue(Ext.form.NumberField.superclass.getValue.call(this)));
142 setValue : function(v) {
143 v = this.fixPrecision(v);
144 v = Ext.isNumber(v) ? v : parseFloat(String(v).replace(this.decimalSeparator, "."));
145 v = isNaN(v) ? '' : String(v).replace(".", this.decimalSeparator);
146 return Ext.form.NumberField.superclass.setValue.call(this, v);
150 * Replaces any existing {@link #minValue} with the new value.
151 * @param {Number} value The minimum value
153 setMinValue : function(value) {
154 this.minValue = Ext.num(value, Number.NEGATIVE_INFINITY);
158 * Replaces any existing {@link #maxValue} with the new value.
159 * @param {Number} value The maximum value
161 setMaxValue : function(value) {
162 this.maxValue = Ext.num(value, Number.MAX_VALUE);
166 parseValue : function(value) {
167 value = parseFloat(String(value).replace(this.decimalSeparator, "."));
168 return isNaN(value) ? '' : value;
175 fixPrecision : function(value) {
176 var nan = isNaN(value);
178 if (!this.allowDecimals || this.decimalPrecision == -1 || nan || !value) {
179 return nan ? '' : value;
182 return parseFloat(parseFloat(value).toFixed(this.decimalPrecision));
185 beforeBlur : function() {
186 var v = this.parseValue(this.getRawValue());
188 if (!Ext.isEmpty(v)) {
194 Ext.reg('numberfield', Ext.form.NumberField);