$ and comma should allow on text box but should not save them

Question

I have below mentioned requirement. On the text box need to allow any characters like "$" and , but while saving need to strip them and save only numbers and a "."

eg: if user enters $14,500.50 save 14500.50

do not show an error in case "$" or "," is entered.

How can I do that ? Any help would be highly appreciated.

Note : At this moment text box is only allowed numeric characters.

@doldt No idea how to do that.At this moment I do have numeric text box. — Sampath, Mar 09 '15 at 07:36
@mplungjan What do you mean by 'server receiving method'.This is just a numeric text box at the moment where bind to the model property ? — Sampath, Mar 09 '15 at 07:43
You tagged this JavaScript and C# so with your lack of further description I assumed JavaScript was used to validate and C# used to store it. So we need the validation method/regex used to block the $ and comma and the C# method to see how you currently parse the value received. — mplungjan, Mar 09 '15 at 07:46

score 2 · Answer 1 · answered Mar 09 '15 at 07:44

You can just parse the number including culture info and numberstyles

string number = "$14,500.50";
double d;
CultureInfo c = CultureInfo.CreateSpecificCulture("en-US");
if(Double.TryParse(number,
                   NumberStyles.Number | NumberStyles.AllowCurrencySymbol,
                   c,
                   out d))
    Console.WriteLine(d);

Output: 14500.5

IDEOne example

Double.TryParse

score 1 · Accepted Answer · answered Mar 09 '15 at 07:39

1

You can use

var newString=yourstring.replace(/[$,]/g, "");

answered Mar 09 '15 at 07:39

squiroid

13,809
6
47
67

score 1 · Answer 3 · answered Mar 09 '15 at 07:42

1

There are tons of Plugins mastering this. https://github.com/RobinHerbots/jquery.inputmask. You need to mask your input so that you can access the masked input value and the raw decimal value.

answered Mar 09 '15 at 07:42

Stephan Ahlf

3,310
5
39
68

I need an Angular solution.Thanks. – Sampath Mar 09 '15 at 07:44
http://stackoverflow.com/questions/16935095/correct-way-to-integrate-jquery-plugins-in-angular-js – Stephan Ahlf Mar 09 '15 at 07:46

score 1 · Answer 4 · answered Mar 09 '15 at 07:43

1

You might be interested in field masks. There is angular-input-masks that should allow you to do it. See the ui-money-mask from demo.

answered Mar 09 '15 at 07:43

fracz

20,536
18
103
149

score 1 · Answer 5 · answered Mar 09 '15 at 09:09

Its really simple actually, you just need to add that replace function in the $parsers pipeline . $parsers do the needed transformation and validation when any value goes from view to model .

Suppose this is your input tag:

<body ng-app="app">
<input type="text" ng-model="currency">
</body>

Now, in the app.js file :

var app=angular.module('app',[])
app.directive('input',function(){
return {
    restrict:'E',
    require: 'ngModel',
    link: function(scope,elm,attr,ngModelCtrl){
        function convert(input){
            input = input.replace(/\$/g,'');
             input = input.replace(/,/g,'');
             return input;
        }
        ngModelCtrl.$parsers.push(convert);
    }
}
})

Here, you are modifying the input directive to replace $ and , with '' (done in the convert function). The convert function is pushed to the $parsers pipeline which will strip off any $ and from any number in the input directive , and store the stripped off number in the model .

Here is a plunker link

You can see the model value "currency" not containing the $ and , sign

If you are not much familiar with $parsers and ngModelCtrl , then do have a look at this blogpost [link](http://mean-aakash.blogspot.in/2015/02/pipeline-of-ngmodelcontroller.html) — Aakash, Mar 09 '15 at 09:11
Can you tell me how to filter other characters (except $ ,comma and dot (.) ) ? In other words only allow numeric and above 3 character types ? — Sampath, Mar 09 '15 at 17:02
Yaa you can do that too , by adding the functions to allow minimum three characters , which should only be numeric in the $parsers pipeline . I have modified the previous plunker [link](http://plnkr.co/edit/ViqqDWex3NSz9ZtTc7DZ?p=preview) to allow this. In , the plunker , min3numbers function allows only minimum three characters that too numeric characters , only then the value will be saved in the model . (value of the model is inside
tag) — Aakash, Mar 10 '15 at 06:06

$ and comma should allow on text box but should not save them

5 Answers5