0

In magento 2.1.X version checkout phone number should accept special character like (-) and should limit to 15 characters but currently it is accepting 10 characters only? I did searched the core but could able to restrict and accept the special characters.

1

Magento 2 out of the box support special character like dash(-) and allow more than 10 character. Please check below link and image.

Magento 2 demo link: http://magento2-demo.nexcess.net

enter image description here

To validate number you can use validate-number in your module checkout_index_index.xml file.

<item name="telephone" xsi:type="array">
    <item name="config" xsi:type="array">
    <item name="tooltip" xsi:type="array">
        <item name="description" xsi:type="string" translate="true">For delivery questions</item>
    </item>
    </item>
    <item name="validation" xsi:type="array">
        <item name="min_text_length" xsi:type="number">10</item>
        <item name="max_text_length" xsi:type="number">10</item>
        <item name="validate-number" xsi:type="number">0</item>
    </item>
</item>
  • This line is restricting symbol (-) but we need that validator. It should accept numbers plus one symbol i.e., hyphen (-). – Prathap Gunasekaran Nov 30 '18 at 11:20
1

In checkout_index_index.xml

<item name="validation" xsi:type="array">                                                                        
    <item name="min_text_length" xsi:type="number">10</item>                                                                         
    <item name="max_text_length_phone" xsi:type="number">15</item>                                                                        
    <item name="validate-number" xsi:type="number">0</item>                                                                    
</item>

and then in vendor/magento/module_ui/view/base/web/js/lib/validation/rules.js

"max_text_length_phone": [ 
        function (value, params) { 
            return !_.isUndefined(value) && value.length <= +params; 
        }, 
        $.mage.__('Phone number cannot exceed 15 characters.') 
    ], 

the above code is for validation text and for adding regex as we require, so in our case this (number with hypens allowed with max length of 15) For, that in Magento_Ui/web/js/lib/validation/rules.js

"validate-number": [
        function(value) {
            return utils.isEmptyNoTrim(value) || (!isNaN(utils.parseNumber(value)) && /^[0-9-\s]+$/.test(value));
        },
        $.mage.__('Please enter a valid number in this field.')
    ],

That's it, we've done it. hope this would helps somebody.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.