Flexible/International Phone Formatting Options

Request to include UK based formatting options:

  • Post Codes in xxx xxx format
  • Phone numbers to allow for (xxxx) xxx xxx format
  • A fairly straight forward change but one that would improve usage by UK based teams.

    Australian numbers also.  

    I have clients that would be quite offended if I have to make them use US formats.  

    Thanks

    This would be of great value to my application also. Please add this function to knack!

    great idea ... 

    I support this but even better if the format was allowed to be defined flexibly so as to apply internationally. Typical preferred formats in the UK are (xxxxx) xxxxxx but some use xxxxxx xxx xxx and some use full +xx xxxx xxxxxx.

    There’s something on roadmap in this matter? Custom formatting is a must. Not only phone numbers, but other type of fields too, like brazilian specific stuff:

    • Phone numbers: (99) 9999-9999 (fixed numbers) or (99) 99999-9999 (cell numbers)
    • CPF: format 999.999.999-99
    • CNPJ: format 99.999.999/9999-99
    • CEP (post code): format 99999-999
    2 Likes

    Solution: use JavaScript to customize input. :smiley:

    LazyLoad.js([
        'https://cdnjs.cloudflare.com/ajax/libs/cleave.js/1.6.0/cleave.min.js', 
        'https://cdnjs.cloudflare.com/ajax/libs/cleave.js/1.6.0/addons/cleave-phone.br.js'
      ], function () {
        console.log('js loaded!');
    });
    
    $(document).on('knack-scene-render.any', function(event, scene) {
      var cleave = new Cleave('#field_48', {
          phone: true,
          phoneRegionCode: 'BR'
      });
    });
    

    PS: Cleave.JS have a lot ready to use solutions, including date formatting and so on.

    1 Like

    Looking to get UK phone formats or the ability to set our own format.

    UK: (NNNNN) NNNNNN or (NNNNN) NNN NNN

    The BR works on input but displays a rather strange format … :slight_smile:

    For the “kiddie scripters” like myself who require detailed instructions on what to do after just copying and pasting the code, and wondering why it’s not working.

    1. You need to change the “cleave-phone.XX.js” to the country code you want to use.
    2. You need to find the input field number of the form you’re using by right clicking it and selecting “Inspect”.
    3. You need to change the “phoneRegionCode:” to country code you’re after which will be the same value as step#1.
    4. You will probably need to do this for every form that you enter a phone number in.

    //For NZ telephone number format//
    LazyLoad.js([
    https://cdnjs.cloudflare.com/ajax/libs/cleave.js/1.6.0/cleave.min.js’,
    https://cdnjs.cloudflare.com/ajax/libs/cleave.js/1.6.0/addons/cleave-phone.nz.js
    ], function () {
    console.log(‘js loaded!’);
    });

    $(document).on(‘knack-scene-render.any’, function(event, scene) {
    var cleave = new Cleave(‘#field_164’, {
    phone: true,
    phoneRegionCode: ‘NZ’
    });
    });