Validación de correo y contraseñas con expresiones regulares
Publicado por raquel (12 intervenciones) el 03/06/2020 22:27:14
Muy buenas gente!
Estoy haciendo un formulario de registro sencillo (nombre, email, contraseña y verificar contraseña), y mi intención era validar tanto el correo como la contraseña con expresiones regulares...
aqui os pongo el codigo html
Es un formulario sencillo con bootstrap... el problema viene ahora... a la hora de validar correo y contraseña con expresiones regulares, el resto funciona correctamente.
He probado con dos expresiones regulares distintas para el correo electrónico, y ninguna de las dos me valida el correo, es decir que un correo tal que [email protected] me lo da por incorrecto.
Y con la contraseña pasa más de lo mismo.
Os escribo a ver si me podéis echar un cable con eso, llevo días escarbando por internet en busca de respuestas, y quizás es una tontería que no estoy viendo.
Muchas gracias por adelantado.
Estoy haciendo un formulario de registro sencillo (nombre, email, contraseña y verificar contraseña), y mi intención era validar tanto el correo como la contraseña con expresiones regulares...
aqui os pongo el codigo html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
<form class="flex-column flex-md-row" action="#" name="registro" id="registro" method="POST" enctype="multipart/form-data" autocomplete="off" onsubmit="return validar();">
<div class="form-group row">
<label for="nombre" class="col-sm-2 col-form-label">Nombre</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="nombre" placeholder="Nombre" >
<span id="Name_error"></span>
</div>
</div>
<div class="form-group row">
<label for="email" class="col-sm-2 col-form-label">Email</label>
<div class="col-sm-10">
<input type="email" class="form-control" id="email" placeholder="Email" >
<span id="Mail_error"></span>
</div>
</div>
<div class="form-group row">
<label for="password" class="col-sm-2 col-form-label">Password</label>
<div class="col-sm-10">
<input type="password" class="form-control" id="pwd1" placeholder="Password" >
<span id="Clave1_error"></span>
</div>
</div>
<div class="form-group row">
<label for="password" class="col-sm-2 col-form-label">Confirma Password</label>
<div class="col-sm-10">
<input type="password" class="form-control" id="pwd2" placeholder="Confirma Password" >
<small id="passwordHelpInline" class="text-muted"> 8-16 caracteres, at least one number, at least one lowercase, at least one uppercase.</small><br>
<span id="Clave2_error"></span>
</div>
</div>
<div class="custom-control custom-checkbox my-4 ">
<input class="custom-control-input" type="checkbox" id="gridCheck" name="acepto" value="yes" >
<span id="Check_error" ></span>
<label class="custom-control-label" for="gridCheck">Acepto<a href=""> las condiciones de uso y privacidad</a><br><small>Debe aceptar antes de registrarse.</small></label>
</div>
<div class="form-group my-3">
<button type="submit" class="btn btn-outline-primary" id="btn" >Registrarse</button>
</div>
</form>
Es un formulario sencillo con bootstrap... el problema viene ahora... a la hora de validar correo y contraseña con expresiones regulares, el resto funciona correctamente.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
var nombre = document.forms["registro"]["nombre"];
var correo = document.forms["registro"]["email"];
var clave1 = document.forms["registro"]["pwd1"];
var clave2 = document.forms["registro"]["pwd2"];
var check = document.forms["registro"]["gridCheck"];
var error_Nom = document.getElementById("Name_error");
var error_Mail = document.getElementById("Mail_error");
var error_pass1 = document.getElementById("Clave1_error");
var error_pass2= document.getElementById("Clave2_error");
var error_check = document.getElementById("Check_error");
nombre.addEventListener("blur", nameVerify, true);
correo.addEventListener("blur", emailVerify, true);
clave1.addEventListener("blur", passwordVerify, true);
function validar (){
//var expresion = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3,4})+$/;
//expresion regular para correo electronico
var expresion = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
//var expresion = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3,4})+$/;
//expresion regular para contraseña
var exp =/^(?=\w*\d)(?=\w*[A-Z])(?=\w*[a-z])\S{8,16}$/;
if(nombre.value == ""){
nombre.style.border = "1px solid red";
error_Nom.textContent ="Nombre requerido";
error_Nom.style.color ="red";
nombre.focus();
return false;
}
if(nombre.value.length < 4 || nombre.value.length > 16){
nombre.style.border = "1px solid red";
error_Nom.textContent ="El nombre debe tener entre de 4 y 16 caracteres";
error_Nom.style.color ="red";
nombre.focus();
return false;
}
if(correo.value == ""){
correo.style.border = "1px solid red";
error_Mail.textContent ="Correo requerido";
error_Mail.style.color ="red";
correo.focus();
return false;
}
/*if (/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3,4})+$/.test(correo)){
alert("La dirección de email " + correo + " es correcta.");
} else {
alert("La dirección de email es incorrecta.");
}*/
if(!expresion.test(correo)){
correo.style.border = "1px solid red";
error_Mail.textContent ="Introduzca un correo válido";
error_Mail.style.color ="red";
correo.focus();
return false;
}
if(clave1.value == ""){
clave1.style.border = "1px solid red";
error_pass1.textContent ="Contraseña requerida";
error_pass1.style.color="red";
clave1.focus();
return false;
}
if(!exp.match(clave1)){
clave1.style.border = "1px solid red";
error_pass1.textContent ="La contraseña debe contener al menos una mayúscula, al menos una minúscula, al menos un dígito y tener entre 8 y 16 caracteres";
error_pass1.style.color="red";
clave1.focus();
return false;
}
if(clave1.value != clave2.value){
clave1.style.border = "1px solid red";
clave2.style.border = "1px solid red";
error_pass1.textContent ="No coinciden las constraseñas";
error_pass1.style.color="red";
return false;
}
}
function nameVerify(){
if(nombre.value != ""){
nombre.style.border = "1px solid #5e6e66";
error_Nom.innerHTML ="";
return true;
}
}
function emailVerify(){
if(correo.value != ""){
correo.style.border = "1px solid #5e6e66";
error_Mail.innerHTML ="";
return true;
}
}
function passwordVerify(){
if(clave1.value != ""){
clave1.style.border = "1px solid #5e6e66";
error_pass1.innerHTML ="";
return true;
}
}
He probado con dos expresiones regulares distintas para el correo electrónico, y ninguna de las dos me valida el correo, es decir que un correo tal que [email protected] me lo da por incorrecto.
Y con la contraseña pasa más de lo mismo.
Os escribo a ver si me podéis echar un cable con eso, llevo días escarbando por internet en busca de respuestas, y quizás es una tontería que no estoy viendo.
Muchas gracias por adelantado.
Valora esta pregunta
0