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

      0  

    Default


    Jeff,

    I will help you testing it and see if it solves the scenario of @maneljn...

    Thanks to you too...
    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.

  2. #12
    Ext JS Premium Member
    Join Date
    Jan 2011
    Posts
    8
    Vote Rating
    0
    pmiguelmartins is on a distinguished road

      0  

    Default simple change

    simple change


    I made a simple change to permit configure the side of the currency symbol ....

    currencySymbolPos : 'right', // left , right

    If you want I can post where

    Pedro Martins

    PS - By the way ... thanks for the great work

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

      0  

    Default


    Quote Originally Posted by pmiguelmartins View Post

    If you want I can post where
    Sure...
    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.

  4. #14
    Ext JS Premium Member
    Join Date
    Jan 2011
    Posts
    8
    Vote Rating
    0
    pmiguelmartins is on a distinguished road

      0  

    Default


    Changes in bold
    Code:
    /*
     * GNU General Public License Usage
     * This file may be used under the terms of the GNU General Public  License version 3.0 as published by the Free Software Foundation and  appearing in the file LICENSE included in the packaging of this file.   Please review the following information to ensure the GNU General Public  License version 3.0 requirements will be met: http://www.gnu.org/copyleft/gpl.html.
     *
     * http://www.gnu.org/licenses/lgpl.html
     *
     * @description: This class provide aditional format to numbers by extending Ext.form.field.Number
     *
     * @author: Greivin Britton
     * @email: brittongr@gmail.com
     * @version: 2 compatible with ExtJS 4
     */
    Ext.define('Ext.ux.form.NumericField', {
        extend: 'Ext.form.field.Number',//Extending the NumberField
        alias: 'widget.numericfield',//Defining the xtype,
        
        currencySymbol: null,
        currencySymbolPos : 'right', // left , right
        useThousandSeparator: true,
        thousandSeparator: ',',
        alwaysDisplayDecimals: false,
        fieldStyle: 'text-align: right;',
        hideTrigger:true,
        
        initComponent: function(){
            if (this.useThousandSeparator && this.decimalSeparator == ',' && this.thousandSeparator == ',') 
                this.thousandSeparator = '.';
            else 
                if (this.allowDecimals && this.thousandSeparator == '.' && this.decimalSeparator == '.') 
                    this.decimalSeparator = ',';
            
            this.callParent(arguments);
        },
        setValue: function(value){
            Ext.ux.form.NumericField.superclass.setValue.call(this, value !=  null ? value.toString().replace('.', this.decimalSeparator) : value);
            
            this.setRawValue(this.getFormattedValue(this.getValue()));
        },
        getFormattedValue: function(value){
            if (Ext.isEmpty(value) || !this.hasFormat()) 
                return value;
            else 
            {
                var neg = null;
                
                value = (neg = value < 0) ? value * -1 : value;
                value = this.allowDecimals && this.alwaysDisplayDecimals ? value.toFixed(this.decimalPrecision) : value;
                
                if (this.useThousandSeparator) 
                {
                    if (this.useThousandSeparator && Ext.isEmpty(this.thousandSeparator)) 
                        throw ('NumberFormatException: invalid thousandSeparator, property must has a valid character.');
                    
                    if (this.thousandSeparator == this.decimalSeparator) 
                        throw ('NumberFormatException: invalid  thousandSeparator, thousand separator must be different from  decimalSeparator.');
                    
                    value = value.toString();
                    
                    var ps = value.split('.');
                    ps[1] = ps[1] ? ps[1] : null;
                    
                    var whole = ps[0];
                    
                    var r = /(\d+)(\d{3})/;
                    
                    var ts = this.thousandSeparator;
                    
                    while (r.test(whole)) 
                        whole = whole.replace(r, '$1' + ts + '$2');
                    
                    value = whole + (ps[1] ? this.decimalSeparator + ps[1] : '');
                }
                
                if (this.currencySymbolPos == 'right') {
                    return Ext.String.format('{0}{1}{2}', (neg ? '-' : ''),  value, (Ext.isEmpty(this.currencySymbol) ? '' : ' ' +  this.currencySymbol));
                } else {
                    return Ext.String.format('{0}{1}{2}', (neg ? '-'  : ''), (Ext.isEmpty(this.currencySymbol) ? '' : this.currencySymbol + '  '), value);
                }
            }
        },
        /**
         * overrides parseValue to remove the format applied by this class
         */
        parseValue: function(value){
            //Replace the currency symbol and thousand separator
            return Ext.ux.form.NumericField.superclass.parseValue.call(this, this.removeFormat(value));
        },
        /**
         * Remove only the format added by this class to let the superclass validate with it's rules.
         * @param {Object} value
         */
        removeFormat: function(value){
            if (Ext.isEmpty(value) || !this.hasFormat()) 
                return value;
            else 
            {
                if (this.currencySymbolPos == 'right') {
                    value = value.toString().replace(' ' + this.currencySymbol, '');
                } else {
                    value = value.toString().replace(this.currencySymbol + ' ', '');
                }
                
                value = this.useThousandSeparator ? value.replace(new RegExp('[' + this.thousandSeparator + ']', 'g'), '') : value;
                
                return value;
            }
        },
        /**
         * Remove the format before validating the the value.
         * @param {Number} value
         */
        getErrors: function(value){
            return Ext.ux.form.NumericField.superclass.getErrors.call(this, this.removeFormat(value));
        },
        hasFormat: function(){
            return this.decimalSeparator != '.' ||  (this.useThousandSeparator == true && this.getRawValue() !=  null) || !Ext.isEmpty(this.currencySymbol) ||  this.alwaysDisplayDecimals;
        },
        /**
         * Display the numeric value with the fixed decimal precision and  without the format using the setRawValue, don't need to do a setValue  because we don't want a double
         * formatting and process of the value because beforeBlur perform a getRawValue and then a setValue.
         */
        onFocus: function(){
            this.setRawValue(this.removeFormat(this.getRawValue()));
            
            this.callParent(arguments);
        },
        processRawValue: function(value) {
            return this.removeFormat(value);
        }
    });

  5. #15
    Sencha User voodoov's Avatar
    Join Date
    Mar 2012
    Posts
    34
    Vote Rating
    0
    voodoov is on a distinguished road

      0  

    Default


    Hi brittongr,
    Thank you for your plugin.

    How can I change this class to comma separate numbers when user is typing them?
    For example on KeyUp or Change Event the comma appears.

    Thank you in Advance
    I You Sencha!

  6. #16
    Sencha User Hermes.Gonzalez's Avatar
    Join Date
    Aug 2011
    Posts
    5
    Vote Rating
    0
    Hermes.Gonzalez is on a distinguished road

      0  

    Default


    Very nice. Great job man! Help me a lot this extension.

    Do you speak spanish or portuguese?
    I was born in Panama but I live in Brazil.

    If you want to make contact, msn: gonzaleznet@hotmail.com.

  7. #17
    Sencha User murrah's Avatar
    Join Date
    Oct 2007
    Location
    Katoomba, Blue Mountains, west of Sydney, Australia
    Posts
    383
    Vote Rating
    11
    murrah will become famous soon enough

      0  

    Default


    Cool! Thank you for this extention!

  8. #18
    Sencha User
    Join Date
    Feb 2008
    Location
    Bangalore, India
    Posts
    72
    Vote Rating
    0
    rhytha is on a distinguished road

      0  

    Default


    Any solution for this??

    How can I change this class to comma separate numbers when user is typing them?
    For example on KeyUp or Change Event the comma appears.

    Regards,
    Riyaz

  9. #19
    Sencha User
    Join Date
    Jun 2010
    Posts
    30
    Vote Rating
    1
    LeonM is on a distinguished road

      0  

    Default


    Very nice plugin! Just what I was looking for


    For those from Europe, you might want to use this:

    PHP Code:
    Ext.define('Ext.ux.form.EuroField', {
        
    extend'Ext.ux.form.NumericField',
        
    alias'widget.eurofield',
        
    currencySymbol'€',
        
    useThousandSeparatortrue,
        
    thousandSeparator'.',
        
    alwaysDisplayDecimalstrue,
        
    fieldStyle'text-align: left;'
    }); 

  10. #20
    Sencha User mysticav's Avatar
    Join Date
    Mar 2007
    Location
    Mexico
    Posts
    474
    Vote Rating
    5
    mysticav is on a distinguished road

      0  

    Default


    Very disappointed to find that it does not support format for decimals.

    I'm looking for an spreadsheet field behavior, where I can define a format decimal precision and the real decimal precision.

    Example:
    For the real value I would enter: 33.33333333
    The displayed value would be: $ 33.33

    but then, the raw value will still be: 33.3333333

    This class doesn't keep the real value.

    So I hope the creator improves it, or somebody collaborate with that functionality.

    Thanks.
    Using Ext with cachefly
    Working on LAMPExt

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..."