Hola
dvd1975:
Como dices que estás empezando con javascript lo voy a plantear despacio para que no te pierdas. Tienes 3 condiciones a cumplir, luego en tu función para validar deberían distinguirse bien en un vistazo esas 3 condiciones:
Código PHP:
if( condicion1 ) {
//error1
}
else if( condicion2 ) {
//error2
}
else if( condicion3 ) {
//error3
}
else {
//sin errores
}
También tienes que tener claro que tu función debe retornar
siempre true o
false, ya que en tu formulario escribirás
onsubmit="return comprobar()", y si se envía o no dependerá de ese true o false.
Una vez buscada esta estructura, tenemos que empezar a buscar condición1, 2 y 3. Vamos una por una:
- La primera ya la tienes, es fácil: campo1.value!==campo2.value
- La segunda tampoco es complicada como has visto: campo1.value==="" || campo2.value===""
- Para la tercera lo tenemos más complicado, porque como no sabemos cuántos espacios en blanco se van a introducir, no podemos hacer una comparación directa. Aquí hay muchas soluciones, te voy a proponer varias:
- Contar cuántos espacios en blanco tiene la contraseña. Si ese número es igual a la longitud del value significa que la contraseña son sólo espacios en blanco (creo que has intentado hacer eso).
- Eliminar los espacios en blanco de la contraseña. Si nos quedamos con una cadena vacía es que eran sólo espacios.
- Partir la cadena según los espacios (split()) y contar cuantas piezas tenemos. Si tenemos tantas piezas como caracteres entonces son todas espacios.
Habrán bastantes más... pero no quiero abrumarte con posibilidades. Tampoco quiero meterme con expresiones regulares si dices que estás empezando... Vamos a seguir tu método de contar espacios.
Para ello podemos ir caracter por caracter mirando si equivale a un espacio, y entonces aumentar la variable contador. Para un campo llamado campo se haría así:
Código PHP:
for(var i=0, l=campo.value.length; i<l; i++) {
if( campo.value.charAt(i)===" " )
contador++;
}
Partiendo la cadena por espacios resulta más directo:
Código PHP:
var contador = campo.value.split(" ").length-1;
Así que me voy a quedar con esta última forma.
Bueno, teniendo ya las tres condiciones, la construcción del script es algo trivial. Te paso el ejemplo completo (un poco modificado).
Código PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
<head>
<meta http-equiv="Content-type" content="text/html;charset=iso-8859-1" />
<title>Ejercicio</title>
<script type="text/javascript">
<!--
// Validador de un formulario
function comprobar(fr) {
var pass1 = fr.contrasena.value; // contraseña
var pass2 = fr.nueva.value; // repetición de la contraseña
var espacios1 = pass1.split(" ").length-1; // número de espacios de la contraseña
var espacios2 = pass2.split(" ").length-1; // número de espacios de la repetición
if( pass1 !== pass2 ) { // si son diferentes
alert("las contraseñas son diferentes");
return false;
}
else if( pass1==="" || pass2==="" ) { // si alguna está vacía
alert("Una o las dos contraseñas están vacías");
return false;
}
else if( espacios1===pass1.length || espacios2===pass2.length ) { // si alguna es sólo espacios en blanco
alert("Una o las dos contraseñas están formadas únicamente por espacios en blanco");
return false;
}
else { // ningún error
alert("Todo va bien");
return true;
}
}
// -->
</script>
</head>
<body>
<form name="formulario" onsubmit="return comprobar(this)" action="">
<p>Introduce una contraseña</p>
<label for="pass">Contraseña</label> <input type="password" id="pass" size="20" name="contrasena"/><br/>
<label for="repass">Nueva contraseña</label> <input type="password" id="repass" size="20" name="nueva" /><br/>
<input type="submit" name="En" value="Enviar" />
</form>
</body>
</html>
Si tienes alguna duda no dudes en postearla.
Un saludo
