2

Estoy tratando de validar el nombre de usuario y clave ingresados. Para la clave, busco que se haya ingresado cualquier valor. Para el nombre de usuario, quiero utilizar la siguiente expresión regular:

/^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))$/i

Quiero que no permita el login en caso de no coincidir con la expresión regular, pero no sé si se pueda hacer con la misma condición del código.

Intenté con .test() pero no sé por qué no me funciona.

El código que intenté:

function loginUsuario() {

    var usuario = document.getElementById("form-login-username").value;
    var password = document.getElementById("form-login-password").value.replace('+', '%2b');
    var validausuario = /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))$/i;

    if ((usuario == '') || (password == '') || (usuario == validausuario.test(document.getElementById('fomr-login-username').value)))
    {

        document.getElementById('formaLoginError').hidden = false;
        document.getElementById('formaLogin').hidden = true;

        document.getElementById('lblError').innerHTML = '<strong>Error!</strong> Favor de ingresar usuario y contraseña correctamente.'
    }
}
4
  • No se si ahora si esta bien corregida la pregunta? Commented el 7 sept. 2016 a las 3:27
  • modifiqué un poco la pregunta para que se entienda mejor. Si hay algo que no esté bien, por favor avisame o modificalo directamente.
    – Mariano
    Commented el 7 sept. 2016 a las 4:03
  • ¿Qué se supone que hace la expresión regular?
    – El Asiduo
    Commented el 7 sept. 2016 a las 9:24
  • Da el formato de un correo electrónico. Commented el 7 sept. 2016 a las 14:06

1 respuesta 1

1

Por supuesto que se puede usar ese regex para validar el nombre de usuario. Veo que estás usando un patrón que coincide si se ingresó un texto similar a una dirección de mail.

El tema principal es cómo estás planteando la condición en el if. Si la condición del if es verdadera, los valores ingresados son incorrectos. Por lo tanto, buscaríamos algo como:

if ((password está vacía) || (usuario NO COINCIDE con el regex)) {
    //Mostrar el error
}
  • Nótese que no hace falta verificar que usuario no esté vacío, porque eso ya lo verifica el regex.

Esto mismo, con las variables que usaste en tu código:

if ((password == '') || !validausuario.test(usuario))
  • El signo ! precediendo a .test() niega a la condición (si es verdadero, se convierte en falso y viceversa)

Por lo tanto, el código quedaría:

function loginUsuario() {

    var usuario = document.getElementById("form-login-username").value;
    var password = document.getElementById("form-login-password").value.replace('+', '%2b');
    var validausuario = /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))$/i;

    if ((password == '') || !validausuario.test(usuario)) {

        document.getElementById('formaLoginError').hidden = false;
        document.getElementById('formaLogin').hidden = true;

        document.getElementById('lblError').innerHTML = '<strong>Error!</strong> Favor de ingresar usuario y contraseña correctamente.';
    } else {
        console.log('VALORES CORRECTOS: Usuario validado y clave no vacía');
    }
}
<form id="formaLogin">
    Usuario:
    <input type="text" id="form-login-username">
    Password:
    <input type="text" id="form-login-password">
    <input type="button" value="Login" onclick="loginUsuario();">
</form>

<span id="formaLoginError" hidden>formaLoginError<br /></span>
<span id="lblError"></span>


Nota: Personalmente, no me gusta mucho cómo está armada esa expresión regular. Yo, en cambio, usaría la siguiente:

/^[^<>()[\].,;:\s@"]+(?:\.[^<>()[\].,;:\s@"]+)*@(?:[^<>()[\].,;:\s@"]+\.)+[^<>()[\]\.,;:\s@"]{2,63}$/i

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.