Use libphonenumber or similar, for smart, region based phone number formatting

[blaedd]

So, while some of the options will suffice, none of the current phone number formats match for Australian landlines, and I won’t even get into the full formatting breakdown (see wikipedia for that. Suffice it to say depending on length and and prefix, the formatting can vary widely, even if you decide to go with national number format (and what happens then if someone starts putting in international numbers when your existing data is all in a national format?).

But, apart from having an (99) 9999-9999 option, smart number/country based formatting would be really great, and Google has even done all the tedious work in libphonenumber for Java, C++ and Javascript. Third party ports for other languages are linked from the Github README.

In particular given a country, and a number it can parse, validate, format the number in a variety of ways (local, national, international), potentially tell you what type of number (voip, fixed line, mobile), time zone, carrier and lots of nice stuff.

It has an internal representation that’s basically country code and a standardized national number, so once you have that you can format it as a national number, an international number in + format, dialling number from another country, etc.

But honestly, just smart formatting with a field configured default country would be an awesome start.

(and yeah, you should see the Asterisk dialplans to cover Aussie numbers… Ugh)

-David

[moe]

David, thanks for this suggestion. First off I just added that phone number format.

There are probably 2 ways to achieve this now. One is using the Javascript library for this and it will be done dynamically. The second is via a Pipe which I’ll put on our to-do list. The Javascript method can be a bit complex, but it would update the values in

We’ll add this as a Pipe in the coming days. For now, if you want to achieve this with some Javascript, I can help you with some code.

If you add this to the footer of your app:
<script type="text/javascript" language="javascript" src="https://cdnjs.cloudflare.com/ajax/libs/libphonenumber-js/1.4.2/libphonenumber-js.min.js"></script>

And this code to the Javascript of the page (replace the component id and field ID and you should be good to go:

TB.render('component_4',function(data){
     $("#fieldJawrRJr5kq").keyup(function () {
            var val_old = $(this).val();
            var newString = libphonenumber.format(val_old, 'US', 'International')
            console.log(newString);
            $(this).focus().val('').val(newString);
    });
});

Here’s a link and demo:
https://localtest.tadabase.io/libphone#!/phone

[moe]

Another follow up, we actually already have a pipe for this: