Phone number format displaying incorrectly with javascript function

Question

Can I get a phone number formatted from 1234567891 to 123-456-7891 using Java script. I have written a function below which is returning
1 234-567-891.Did i miss anything below.
Your suggestion is appreciated a lot.
Code below is writen in angular-moment.js file for custom filters. Which later on I will be using in HTML.

.filter('phonenumber', function() {
             return function (number) {
                 if (!number) { return ''; }
                 number = String(number);
                 var fNumber = number;

                 var c = (number[0] == '1') ? '1 ' : '';
                    number = number[0] == '1' ? number.slice(1):number;
                    var area = number.substring(0,3);
                    var front = number.substring(3, 6);
                    var end = number.substring(6, 10);

                    if (front) {
                        fNumber  = (c + "" + area + "-" + front);   
                    }
                    if (end) {
                        fNumber += ("-" + end);
                    }
                    return fNumber ;
                };
            })

Checking for first 3 numbers. This scenario is reproduced only when I enter first number as 1 Any guidance on how to implement this would be greatly appreciated.

Possible duplicate of [Formatting a string to a certain format](https://stackoverflow.com/questions/42330936/formatting-a-string-to-a-certain-format) — Bill Tarbell, Jun 23 '17 at 04:30

score 0 · Answer 1 · answered Jun 23 '17 at 04:06

you dont needd to expicitly check for 1 : below code should work fine :

.filter('phonenumber', function() {
         return function (number) {
             if (!number) { return ''; }
             number = String(number);
             var fNumber = number;

                var area = number.substring(0,3);
                var front = number.substring(3, 6);
                var end = number.substring(6, 10);

                if (front) {
                    fNumber  = (area + "-" + front);   
                }
                if (end) {
                    fNumber += ("-" + end);
                }
                return fNumber ;
            };
        })

score 0 · Answer 2 · answered Jun 23 '17 at 04:27

0

Suppose this is you HTML

<p class="number">2124771000</p>

And this you JS

$(".number").text(function(i, text) {
        text = text.replace(/(\d{3})(\d{3})(\d{4})/, "$1-$2-$3");
        return text;
    });

answered Jun 23 '17 at 04:27

Rohan Kawade

453
5
18

score 0 · Answer 3 · answered Jun 23 '17 at 05:43

If you have validations for number to be more than 9 digits , you can try below code

angular.module("myApp", []).filter("phonenumber", function() {

      return function(number) {
        if (number) {
          number = number.toString();
          return number.slice(0, 3) + "-" + number.slice(3, 6) + "-" + number.slice(6);
        }

      }

    });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<body ng-app="myApp">

  {{123456789 | phonenumber}}

</body>

Phone number format displaying incorrectly with javascript function

3 Answers3