Hybrid View

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

      0  

    Post Number field with currency symbol, thousand separator with international support

    Number field with currency symbol, thousand separator with international support


    Hi, i just created an extension of NumberField that allows you to create number fields with aditional features like:

    Update 16/03/2011

    The text in red are no longer valid.
    No longer need functions to update the format.
    No more $ by default.
    Thousand separator allows any character including blank space (' ').
    Improved getFormattedValue function and other code, now is more clean and short.

    1. Currency Symbol (by default is $), if you don't need a currency symbol just set the config option to null or empty string:
    Code:
    currencySymbol: null
    . To change the currency after the field was created you should use the function setCurrencySymbol.

    No more $ by default, if you need it set up manually by using the config option like before: currencySymbol: $.

    2. Thousand separator, you can use comma (,) or (.) any character. If decimalSeparator is (,) then thousand separator will be (.) when thousandSeparator use default value. By default decimalSeparator is (.) and thousand separator (,). Also you cand hide thousand separator using the config option:
    Code:
    useThousandSeparator: false
    .

    There are also a functions for setDecimalPrecision and setDecimalSeparator.

    3. Display always all the decimals from the given decimal precision value the default value for this config option is:
    Code:
    alwaysDisplayDecimals: false
    .


    4. Config option to set any thousandSeparator:
    Code:
    thousandSeparator:'.'
    .


    If you are changing the properties after the field is created and don't want or you can't use the functions for any reason you must call updateNumberFormat function.

    Here is an screenshot:


    NumericField.jpg


    The first fielset shows a list of fields configured for int values with the different options

    The second fieldset shows a list of fields configured for float values with a decimal precision of 4 and you can notice there are only 3 decimals visibles because only 3 were entered for the values.

    The third fielset shows a list of fields configured for float values with a decimal precision of 4 and you can notice there are 4 decimals but last one is zero (0) they have the same values as the second fieldset and also thousand separator is "blank space"

    Here is the source code: (Actual version) NumericField.zip

    Hope it helps.
    Last edited by brittongr; 16 Mar 2011 at 3:10 AM. Reason: adding new info

  2. #2
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,501
    Vote Rating
    47
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    This stuff is in Ext 4.0.

    Ext.util.Format has number and currency formatting options.

  3. #3
    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 Animal View Post
    This stuff is in Ext 4.0.

    Ext.util.Format has number and currency formatting options.
    I haven't tried yet Ext 4.0, but what a wanted to do it was a class that encapsulate all these features that are very basic, just a few overrides but without to much code because i don't want to lose or get a conflict with the base class in this case (Ext.form.NumberField) so the overrides only remove/add the custom format to the value and then call the superclass functions to let it handle whatever is implemented.

    As far as i saw there is no property currencySymbol or a property to set the format as a config option or the thousandSeparator config option in the class of the documentation of Ext 4.0 but maybe i didn't see well...

    I know with Ext.util.Format you can get that and in fact that is what i'm using inside the class to format the values but the reason that i did the class was because i don't want to add that functionallity manually for every number field that i have in the form.

    But if you can give a hint to archive this without an extra class or extra work, i will be thankfull.
    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. #4
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,501
    Vote Rating
    47
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    It is there and documented in 4.0


  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


    Thank you animal!, i was looking in Ext.for.Number class that's why i didn't found it...
    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 2009
    Posts
    68
    Vote Rating
    3
    IvanJ is on a distinguished road

      0  

    Default


    I just tried using this in a grideditor and none of the features work

    BTW Animal, saying "this is all in ExtJS 4" doesn't really help anyone dealing with this in ExtJS 3

  7. #7
    Ext JS Premium Member bregard's Avatar
    Join Date
    Jul 2008
    Posts
    26
    Vote Rating
    0
    bregard is on a distinguished road

      0  

    Default


    Quote Originally Posted by Animal View Post
    This stuff is in Ext 4.0.

    Ext.util.Format has number and currency formatting options.
    I have used Ext.util.Format in charts and grids, but don't see an easy built in way to handle formatting with fields. Could you provide an example? Thanks...

  8. #8
    Sencha User
    Join Date
    Jul 2011
    Posts
    6
    Vote Rating
    0
    lhidalgo is on a distinguished road

      0  

    Default


    Quote Originally Posted by Animal View Post
    This stuff is in Ext 4.0.

    Ext.util.Format has number and currency formatting options.
    Hi, i'm sorry Animal but i don't see any way to add a formatter to the numberfield.
    Can you show me the property to use for this please ?

    If there's no way to do it simply maybe it exist an extension for Ext 4?

  9. #9
    Ext JS Premium Member bregard's Avatar
    Join Date
    Jul 2008
    Posts
    26
    Vote Rating
    0
    bregard is on a distinguished road

      0  

    Default


    Quote Originally Posted by lhidalgo View Post
    Hi, i'm sorry Animal but i don't see any way to add a formatter to the numberfield.
    Can you show me the property to use for this please ?

    If there's no way to do it simply maybe it exist an extension for Ext 4?
    BUMP

  10. #10
    Sencha User
    Join Date
    Jul 2011
    Posts
    6
    Vote Rating
    0
    lhidalgo is on a distinguished road

      0  

    Default


    Quote Originally Posted by bregard View Post
    BUMP
    Sorry i'm not very good in english, what means "BUMP" ?

    Nobody have an answer about formating fields ?

Similar Threads

  1. Currency / money field with selectable currency
    By simplessus in forum Ext 3.x: Help & Discussion
    Replies: 3
    Last Post: 22 Jan 2011, 3:24 AM
  2. Number Field with currency formatting
    By JSCoder in forum Ext 3.x: Help & Discussion
    Replies: 1
    Last Post: 2 Sep 2009, 9:39 AM
  3. Currency Symbol in Ext.ND views
    By cujo13 in forum Ext.nd for Notes/Domino
    Replies: 2
    Last Post: 12 Mar 2009, 6:55 AM
  4. [FIXED] LabelField shows ":" separator symbol
    By Grandiosa in forum Ext GWT: Bugs (1.x)
    Replies: 2
    Last Post: 8 Jun 2008, 8:26 PM

Thread Participants: 21

Tags for this Thread

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..." hd porno faketaxi