Not able to type in a comma

4 posts, 0 answers
  1. Bilal
    Bilal avatar
    109 posts
    Member since:
    Oct 2014

    Posted 15 Jun 2015 Link to this post

    Hi,

    I have a numeric textbox inside a Grid. I would like to allow showing a "," as a separator (thousands) and also allow decimals.

    In the OnEdit of the Grid, I have the following setup:

    1.edit: function(e) {
    2.                e.container.find("input[name^=costOperand]").kendoNumericTextBox({
    3.                    min: 1,
    4.                    max: 888888887,
    5.                    step: 100
    6.                });
    7.}

     

    With the above the numeric textbox doesn't allow me to type in a ",". Only decimals are allowed.

    Any idea?

     

    Thanks

  2. Plamen Lazarov
    Admin
    Plamen Lazarov avatar
    135 posts

    Posted 17 Jun 2015 Link to this post

    Hi,

    In general the NumericTextBox operates in two modes - display and edit. While in edit mode it allows to type in only numbers, "-" and decimals operator(which is defined by the current culture). Once the widget is in display mode(on blur) it will format the entry based on the culture and format configuration.  

    Please refer to this example. If 10000 is entered and the current culture is "en-US" the number will be displayed as 10,000.00

     

    Regards,
    Plamen Lazarov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Simon
    Simon avatar
    8 posts
    Member since:
    Mar 2014

    Posted 12 Dec 2019 in reply to Plamen Lazarov Link to this post

    I've got a requirement to implement this as well - they would like to see "12,345,678" during edit mode as well as display.

  4. Alex Hajigeorgieva
    Admin
    Alex Hajigeorgieva avatar
    1082 posts

    Posted 16 Dec 2019 Link to this post

    Hi, Simon,

    I can see that you have also submitted a private support thread asking the same question.

    I will paste the response here for future reference, in case you have further questions, please let us resolve them privately and then we can update this public forum.

    _________________________________________________

    When in edit mode the numeric displays the actual number value (js number) - not a string. Thus, it is not possible to format it.

    However, you could achieve the described behavior by handling the input event handler of an input element.

    e.g.

    function formatValue(e){
        var value = $(e.target).val();
        var number = parseFloat(value.replace(/,/g, ''));
        var newValue = isNaN(number) ? 0 : number;                  
        $(e.target).val(kendo.toString(newValue,"n0"));   
    }

    Below you will find a small sample which demonstrates the above approach:

    https://dojo.telerik.com/oJEtiTig/4

    Kind Regards,
    Alex Hajigeorgieva
    Progress Telerik

    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top