View Full Version : How to make a numberfield as Currency Field?

24 Feb 2014, 8:25 PM
How to make a numberfield as currency?

I need to key in the price of fruit/vegetable when i select a specific fruit. So this field is visible to enter the price. If we don;t think we can do it using a number field, i'm ok making it a text field. Any suggestions?

I tried to put in a listener for change/blur, but it is not working meaning it is firing after i enter every digit.

I'm using the following code but none of the properties in red below are working.
{ xtype: 'numberfield',
fieldLabel: 'Rate',
labelAlign: 'right',
hidden: true,
name: 'rate',
width: 450,
currencySymbol: '$',
allowDecimals: true,

Thanks in advance....

24 Feb 2014, 9:14 PM
Use Ext.util.Format class to convert the value and display in currency format.


See the above link for documentation. You will find a function named 'currency'. But I dono how you can display a $ symbol in numberfield. May be you can change it to textfield if it is not a big deal.

I hope it helps.

24 Feb 2014, 10:02 PM
Hi Prem, thanks for the reply

But i changed to textfield and used the line below. it worked. Also i added the line if it is a number field to work, just in case if any one needs it.

listeners: {
blur: function(field) {
// Code to format the number field on blur
//field.setRawValue(Ext.util.Format.number(field.getValue(), '0.00'));
// Code to display the currency value in a text field. Make sure to use maskRe to disallow text, otherwise you //will end up getting NaN
field.setRawValue(Ext.util.Format.currency(field.getValue(), '$ ', 2));


24 Feb 2014, 10:36 PM
Glad I could help..:)