Is there any way to check if a cell phone number is valid?

Question

I searched search sites and couldn’t find anything that could help; I needed to prevent residential numbers from being typed in the input the ideal would be to use only javascript for this.

Answer 1

Well, regex is not my strong suit. But I tried something for you here, I followed the following pattern:

• The value entered by the user must start with 8 or 9 - ^[9|8];
• Should be followed only by numbers - \d;
• Must have a minimum size of 7 digits and a maximum of 8 - {7,8};

And this is the regex I made to validate what I said above: /^[9|8]\d{7,8}/g

---

Example

CSS (Only to make the border red...)

/* Só para remover o outline */
input.phone-number:focus {
    outline: none;
}

input.phone-number.invalid {
    border: red 1px solid;
}

HTML (A basic form)

<form id="form">
    <input type="tel" class="phone-number" autofocus="true" placeholder="Digite um número de celular" maxlength="9">
    <button type="submit">Enviar</button>
</form>

Javascript

// Quando o DOM estiver pronto;
document.addEventListener('DOMContentLoaded', function() {

    // Pega o input do telefone;
    var phone = document.querySelector('.phone-number');

    // Detecta quando o formulário for enviado;
    document.getElementById('form').onsubmit = function(evt) {

        // Se não passar na validação do regex;
        if(!phone.value.match(/^[9|8]\d{7,8}/g)) {
            phone.classList.add('invalid');
        }

        // Se passar na validação do regex;
        else {
            // Envia o formulário caso seja valido
            return true;
        }

        // Falso por padrão para que o formulário só seja enviado caso seja válido;
        return false;
    };

}, false);

In case I detect when the form is sent with the function onsubmit(); and leave a return false; by default, only for the form to be sent only if it is valid;

If the number is not valid I add the class .invalid to the input.phone-number;

Otherwise I allow the sending of the form...

@Edit

I’ve done a little function for you here, see if it helps at all:

;(function(window, undefined) {

    "use strict";

    function phoneNumber(params) {
        if(!(this instanceof phoneNumber)) {
            return new phoneNumber(params);
        };

        this.element = params;
    }

    phoneNumber.prototype = {

        check: function(callback, error) {

            var oThis = this,
                oReturn = false;

            [].slice.call(document.querySelectorAll(this.element)).forEach(function(element){
                if(element.value.match(/^\d{2}[8|9]\d{7,8}/g)) {
                    if(callback) callback();
                    oReturn = true;
                }
                else {
                    if(error) error();
                };
            });

            return oReturn;
        }

    };

    window.phoneNumber = phoneNumber;

}(window));

You can create a file .js and insert into your document in the same way you would with jQuery for example;

<script src="nomedocript.js"></script>

And then you can use it like this:

document.addEventListener('DOMContentLoaded', function() {

    var oPhone = document.querySelector('.phone-number');

    oPhone.oninput = function() {

        phoneNumber('.phone-number').check(function() {
            oPhone.classList.remove('invalid');
            oPhone.classList.add('valid');
        }, function() {
            oPhone.classList.remove('valid');
            oPhone.classList.add('invalid');
        });


    };

});

The function phoneNumber('SELETOR DO ELEMENTO QUE QUER VALIDAR') is what I created for you to use, you should call the method .check(), then it will return true or false for value() of the input you are using;

Behold:

// Retorna true para 15954418200;
// Mas false para 123
phoneNumber('.phone-number').check();

If you want to use a callback (as in the example), just pass them as functions within the method check(), see:

phoneNumber('.phone-number').check(function() {
    // Callback para sucesso
}, function() {
    // Callback para erro
});

Unfortunately, due to portability it is not possible to verify which operator of a number only by the number itself. If you want to validate this, you’ll have to use another system, maybe even work with requests AJAX for ready-made systems; @Math left a comment on your question one of these services, will you check which is the best to use...