1. #1
    Ext JS Premium Member
    Join Date
    Mar 2011
    Posts
    38
    Vote Rating
    1
    andyjl is on a distinguished road

      0  

    Post CurrencyField extends NumberField to format display as currency

    CurrencyField extends NumberField to format display as currency


    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.
    Code:
    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
    Last edited by andyjl; 6 Sep 2011 at 1:25 PM. Reason: Some fixes

  2. #2
    Ext JS Premium Member
    Join Date
    Mar 2011
    Posts
    38
    Vote Rating
    1
    andyjl is on a distinguished road

      0  

    Default


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

  3. #3
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,637
    Vote Rating
    400
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    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.

  4. #4
    Ext JS Premium Member
    Join Date
    Mar 2011
    Posts
    38
    Vote Rating
    1
    andyjl is on a distinguished road

      0  

    Default


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

  5. #5
    Sencha User brittongr's Avatar
    Join Date
    Jun 2007
    Location
    Panama
    Posts
    109
    Vote Rating
    3
    brittongr is on a distinguished road

      0  

    Default


    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
    Greivin Britton

    My Extensions:
    Ext.ux.NumericField: Number field with support for currencySymbol, thousand separator, international...
    Ext.ux.PagerSizeSelector: A plugin that allows the change page size with just one click.
    Ext.ux.FieldAccess: A plugin to let the user know which fields are editable.

  6. #6
    Sencha User
    Join Date
    Nov 2011
    Posts
    2
    Vote Rating
    0
    eider is on a distinguished road

      0  

    Default Error handling multiple thousandSeparators

    Error handling multiple thousandSeparators


    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.

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

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar