addToValidate strange behavior

Hello,
i am trying to do custom validation.

The field is a phone number and it should be:

  1. not empty
  2. only numbers
  3. in E164 format (+39XXXXXXXXX)

This is the code:

public function display(){
        $js = <<<JS
            <script type="text/javascript">
                $( document ).ready(function() {

                    function isE164Number(phoneNumber) {
                        const regEx = /^\+[1-9]\d{10,14}$/;
                        console.log(regEx.test(phoneNumber));
                        return regEx.test(phoneNumber);
                    };

                let service_type = document.getElementById('service_type').value;
                $('#service_type').prop("disabled",true);
                const required_fields = ['reference_number'];
                switch(service_type) {
                    case 'Internet':
                    case 'Landline':
                        required_fields.push("activation_street","activation_city","activation_state","activation_postalcode","activation_country"); 
                    break;
                }
                required_fields.forEach(function(element){
                    let required_switch = document.createElement('span');
                    required_switch.className = 'required';
                    required_switch.innerHTML = '*';
                    document.getElementById(element).parentElement.previousElementSibling.appendChild(required_switch);
                });
                
                $("#reference_number").on('change', function(){
                    makerequired(); 
                }); 

                function makerequired() {
                    let reference_number = document.getElementById('reference_number').value;
                    if(reference_number === ''){
                        let msg = document.getElementById('reference_number').parentElement.previousElementSibling.innerHTML.split(':')[0];
                        addToValidate('EditView', 'reference_number', 'int', false, msg);
                    } else {
                        if(!isE164Number(reference_number)) {
                            removeFromValidate('EditView',  'reference_number');  
                            addToValidate('EditView', 'reference_number', 'int', true, "Mobile Number is not in E164 format");
                        } else {
                            removeFromValidate('EditView',  'reference_number');  
                        }
                    }
                }

                makerequired(); 
            });
            </script>
        JS;
        echo $js;
        parent::display();
    }

All works well, it adds validation in field if is empty or contains chars in it.
However when the field contains numbers ex: 234 it gets validated instead of showing that field is not E164.

The function isE164Number() is logging false, means that is not E164 format so something is not working fine with addToValidate.

What am i doing wrong?

Many Thanks

@rainolf

I think that type of the field should be phone. Change int to phone in function addToValidate and in vardefs.

I will try,
what kind of validation occurs in phone fields? does custom function isE164number still required?

Thanks

Changed field type in phone.
Phone type is a special varchar which seems doesn’t add any special validation.
Now due to changes also chars get validated, the only exception is if field is empty.
Also not clear 4th parameter(boolean).