I numeri di cellulare italiani sono abbastanza semplici da validare. Tuttavia se ci limitassimo ai soli numeri italiani la nostra procedura di validazione avrebbe un'efficacia ridotta. Con jQuery possiamo associare ad un input di testo un metodo che validi il numero di cellulare o di telefono inserito rispetto ad un espressione regolare passata come argomento. Vediamo come fare.
Il nostro plugin dovrà accettare un'espressione regolare ma dobbiamo assicurarci che l'espressione regolare sia valida. Per questo motivo verificheremo che:
- L'argomento passato sia definito.
- Il campo del form sia di tipo testo.
- L'argomento passato sia effettivamente un'espressione regolare.
Per dovere di cronaca ricordo che HTML5 fornisce già un modo per validare un input attraverso le espressioni regolari. Tuttavia, dato lo stato del supporto nei browser, affidarsi a questa soluzione può non essere efficace in tutti i casi.
Ecco il nostro plugin:
(function($) {
$.fn.isPhoneNumber = function(re) {
var that = this;
var value = this.val();
try {
var construct = re.constructor.toString();
} catch (e) {
return console.log('Missing or invalid argument.');
}
if (!that.is(':text')) {
return console.log('Invalid form field.');
}
if (construct.indexOf('RegExp') == -1) {
return console.log('Invalid regular expression');
}
return re.test(value);
};
})(jQuery);
Abbiamo deciso di eseguire il logging degli errori alla console piuttosto che di generare errori effettivi tramite l'oggetto Error. Internet Explorer 8 (e inferiori) non supporta il metodo di logging usato, quindi in fase di sviluppo si consiglia di visualizzare le eccezioni nella finestra del browser. Se avessimo sollevato errori, IE avrebbe visualizzato tali errori nella barra di stato. Com'è noto, la gestione degli errori di Explorer è alquanto lacunosa, quindi si consiglia di gestirli direttamente.
Per i numeri di cellulare italiani l'espressione regolare è la seguente:
var $re = /^3\d{9}$/;
I numeri validi iniziano tutti con il numero 3 e sono seguiti da altre 9 cifre. I numeri fissi invece iniziano con lo 0 del prefisso e sono seguiti da 7 o 9 cifre. Ovviamente se si aggiunge il prefisso internazionale occorre calcolare le due cifre aggiuntive in entrambi i casi (39).
L'unica verifica effettiva su un numero telefonico avviene per i cellulari. Infatti è possibile inviare un SMS con un codice di conferma che poi l'utente dovrà inserire per completare la procedura iniziata.
Per i numeri fissi invece la verifica risulta di fatto molto difficile da automatizzare, ma ci si affida al fatto che è nell'interesse dell'utente fornire credenziali valide.
Ecco quindi un esempio pratico dell'uso del nostro plugin:
$('#form').submit(function(e) {
var $re = /^3\d{9}$/;
var valid = $('#mobile').isPhoneNumber($re);
if (!valid) {
alert('This is not a valid Italian mobile number.');
e.preventDefault();
} else {
alert('This is a valid Italian mobile number.');
e.preventDefault();
}
});
Potete visionare l'esempio finale in questa pagina.