JSFiddle - React, Tailwind, and code Playground

HTML

<form name="signin_form"  action="../processes/login_process.php" onSubmit="return checkLoginData()"  method="POST">

          <h1>Accesso Utente</h1>

          <p>
             <label for='tf_nick'>Nick</label>
             <input type='text' id='tf_nick' name='tf_nick' value="">

             <label for='tf_password'>Password</label>
             <input type='password' id='tf_password' name='tf_password' value=''>

             <input type='submit' value='OK'>
             <input type='reset' value='Pulisci'>
           </p>

        </form>

     </div>

JavaScript

function checkLoginData(){
        var formObj = document.signin_form;     
        var nick    = "" + formObj.tf_nick.value;
        var pass    = "" + formObj.tf_password.value;

        if ( nick == "" ) {
            alert("Inserisci il nick per accedere!");
            return false;

        } else if ( pass == "" ) {
            alert("Inserisci la password per accedere!");
            return false;

        } else {

            var regExNick = /(?=.*[0-9])(?=.*[a-zA-Z%])^[a-zA-Z0-9%]{3,6}$/;        
            var regExPass = /(?=.*[a-z])(?=.*[A-Z])^[a-zA-Z]{4,8}$/;

            if ( !regExNick.test(nick) ){
                alert("Nick non valido!");
                return false;

            } else if ( !regExPass.test(pass) ) {
                alert("Password non valida!");
                return false;

            } else {
                return true;
            }
        }
    }