JavaScript: validare un nome utente con la validazione inline

Short link

In JavaScript è semplice validare un nome utente.

Supponiamo di avere questa marcatura:


<input type="text" name="username" id="username" class="form-control">

Un nome utente valido nel nostro esempio può contenere solo lettere, numeri e underscore. Validiamo il campo con la validazione inline in questo modo:


const username = document.querySelector('#username');

username.addEventListener('blur', () => {
    this.classList.remove('is-invalid');
    
    if(!/^\W+$/.test(this.value)) {
        this.classList.add('is-invalid');
    }
});

L'autore

Gabriele Romanato, sviluppatore web full stack specializzato in siti, applicativi web ed e-commerce con Node.js e PHP.