To remove group separator and decimals in number input - Angular, Vue, React, Web Components, Javascript, HTML5 Widgets

Tagged: decimalDigits, decimalSeparator, jqxnumberinput, numberinput, Symbol

This topic contains 5 replies, has 2 voices, and was last updated by Nadezhda 9 years, 7 months ago.

Viewing 6 posts - 1 through 6 (of 6 total)

Author

To remove group separator and decimals in number input Posts
February 11, 2015 at 2:08 pm To remove group separator and decimals in number input #66924

nikhil22
Participant

Hi,

I am building a jqwidget form which has currency input fields.By default i am getting group separators and decimal places like $__,___,__0.00.
Is it possible to remove those separators and decimal places and have only $ symbol.

Thanks in advance 🙂

February 11, 2015 at 5:23 pm To remove group separator and decimals in number input #66941

Nadezhda
Participant

Hello nikhil22,

Here is an example with jqxInput: http://jsfiddle.net/vyp7ffcs/.
In other case with jqxNumberInput you should have ‘decimal’ because default value is 0: http://jsfiddle.net/erp2ojb4/.

Best Regards,
Nadezhda

jQWidgets team
http://www.jqwidgets.com/

February 12, 2015 at 3:14 am To remove group separator and decimals in number input #66955

nikhil22
Participant

Hi Nadezhda,

Thanks for the reply.Is it possible that on blur event only comma separators are added without any underscores.

February 12, 2015 at 7:28 am To remove group separator and decimals in number input #66978
Nadezhda
Participant
Hi nikhil22,

In the following example you can find how to use comma separator with ‘blur’ event.
```
<!DOCTYPE html>
<html lang="en">
<head>
    <title></title>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.11.1.min.js"></script>
    <script type="text/javascript" src="../../scripts/demos.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxnumberinput.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            // Create jqxNumberInput
            $("#numericInput").jqxNumberInput({ width: '250px', height: '25px' });
            $("input.jqx-widget-content").blur(function () {
                $("#numericInput").jqxNumberInput({ decimal: 0, inputMode: 'simple', decimalSeparator: "," });
            });
        });
    </script>
</head>
<body class='default'>
    <div style='margin-top: 10px;'>
        Number
    </div>
    <div style='margin-top: 3px;' id='numericInput'>
    </div>
</body>
</html>
```
Best Regards,
Nadezhda

jQWidgets team
http://www.jqwidgets.com/
February 12, 2015 at 9:39 am To remove group separator and decimals in number input #66992

nikhil22
Participant

Hi Nadezhda,

I tried your code but nothing is changing.
On blur the input content is getting reset to 0.00

February 12, 2015 at 10:49 am To remove group separator and decimals in number input #67000

Nadezhda
Participant

Hi nikhil22,

Please, make sure all your jQWidgets files are updated to version 3.7.0.

Best Regards,
Nadezhda

jQWidgets team
http://www.jqwidgets.com/
Author

Posts

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.