SwissUpLabs Logo

Phone Fields mask

This article help you to set the right mask for the fields: telephone, fax.

Firecheckout uses Text Mask library to create field masks.

Please read TextMask Docs for more information.

  1. Create custom.js file. custom.js
  2. Using a demo of Text Mask, choose the phone mask.
  3. According this an example set the masks.

        ], function ($, _, mask, placeholder) {
            'use strict';
            // define scope form which will be using to set the phone-mask
            var scopes = [
            _.each(scopes, function (scope) {
                    guide: false,
                    mask: function (raw) {
                        var mask =['(',/\d/, /\d/,')',/\d/,/\d/,/\d/,/\d/,/\d/,'-',/\d/,/\d/,/\d/,/\d/];
                        if (raw.length == 13) {
                            mask = ['(',/\d/, /\d/,')',/\d/,/\d/,/\d/,/\d/,'-',/\d/,/\d/,/\d/,/\d/];
                        return mask;
                    guide: false,
                    mask: function (raw) {
                        var mask =[/\d/, /\d/,'-',/\d/,/\d/,/\d/,'-',/\d/,/\d/,/\d/,/\d/];
                        return mask;
            // you can show the mask of a field in the placeholder



  4. Save the file and run following bash commands to deploy script:

        cd magento/root/folder
        rm -rf var/view_preprocessed pub/static/frontend
        bin/magento setup:static-content:deploy
  5. That’s all.
Next up
Edit this Page