CurrencyField extends NumberField to format display as currency

[andyjl]

I created this as of a requirement for a project I'm working on, so I thought I'd share it here.
It is somewhat based off of this extension.

Ext.define('Teller.ext.CurrencyField', {	extend: 'Ext.form.field.Number',	alias: 'widget.currencyfield', 	hideTrigger: true, 	setValue: function (v) {		this.callParent(arguments); 		if (!Ext.isEmpty(this.getValue())) {			this.setRawValue(Ext.util.Format.currency(this.getValue()));		}	}, 	removeFormat: function (v) {		if (Ext.isEmpty(v)) {			return '';		} else {			v = v.toString().replace(Ext.util.Format.currencySign, '').replace(Ext.util.Format.thousandSeparator, '');			if (v % 1 === 0) {				// Return value formatted with no precision since there are no digits after the decimal				return Ext.util.Format.number(v, '0');			} else {				// Return value formatted with precision of two digits since there are digits after the decimal				return Ext.util.Format.number(v, '0.00');			}		}	}, 	// Override parseValue to remove the currency format	parseValue: function (v) {		return this.callParent([this.removeFormat(v)]);	}, 	// Remove the format before validating the value	getErrors: function (v) {		return this.callParent([this.removeFormat(v)]);	}, 	/* Override getSubmitData to remove the currency format on the value 	that will be passed out from the getValues method of the form */	getSubmitData: function () {		var returnObject = {};		returnObject[this.name] = this.removeFormat(this.callParent(arguments)[this.name]); 		return returnObject;	}, 	// Override preFocus to remove the format during edit	preFocus: function () {		this.setRawValue(this.removeFormat(this.getRawValue())); 		this.callParent(arguments);	} });

To use it, specify 'currencyfield' as the xtype of a form field.

Enjoy!

Update: Fixed hard-coded Amount column to be generic based on the name; fixed situations where the value is less than zero or greater than 999

[andyjl]

The Forum is messing up the formatting of the code, so here is the file:
CurrencyField.zip

[scottmartin]

The Forum is messing up the formatting of the code

Try using CODE tags instead of PHP CODE and see if that helps. I remember that it works better in some cases.

Regards,
Scott.

[andyjl]

Thanks for the tip - I tried the CODE tag but it doesn't work any better.

[brittongr]

Thanks for the mention andygl, i also referred yours in this thread about my extension that works with extjs4.

http://www.sencha.com/forum/showthre...support-ExtJS4

[eider]

The removeFormat method in the code above won't handle amounts with multiple separators. You need to replace the separator globally using a regex expression with the replace method. Otherwise the method returns an empty string.

var thou = new RegExp(Ext.util.Format.thousandSeparator,'gi');
v = v.toString().replace(Ext.util.Format.currencySign, '').replace(thou, '');