de validaciones

jhz1983 · #1 (**permalink**) 16/05/2011, 09:37

soy bastante novato y estoy intentando validar un formulario bastante simple.. me pasa esto .. si coloco return false en cada condicion.. solo se ejecuta el codigo hasta el primer error .. el problema es que si solo lo pongo en el ultimo.. y ese esta correcto se envia la información .. como puedo solucionar esto?

Código HTML:

<html>
	<head>
	<link rel="stylesheet" href="formu.css" type="text/css">
	<title>
		Fórmulario - Datos personales
	</title>
	<script language="javascript">
	<!--
	function valida()
		{
		if(!(document.registro.nombre.value.length>=4)&&(document.registro.nombre.value.length<=8))
				{
				if(document.registro.nombre.value.length=="0")
					{
					document.getElementById("er_name").innerHTML = (" &nbsp&nbsp Este campo no puede estar vacio.");
										}
					else {
						document.getElementById("er_name").innerHTML = (" &nbsp&nbsp Este campo a de tener entre 4 y 8 caracteres");

						}
				}

				if(document.registro.apellidos.value.length=="0")
				{
					document.getElementById("er_ape").innerHTML = (" &nbsp&nbsp Este campo no puede estar vacio");
					return false;
				}

			else
				return true;


		}
	//-->>
	</script>

	</head>
<body>
<h2>Datos personales</h2>
<br>
<form name="registro" method="post" onSubmit="return valida()">
<Fieldset style="margin:auto;">
	<legend>Registro nuevo usuario</legend>

						<label for="nombre">Nombre: </label><input type="text" id="nombre" name="nombre"> <span id="er_name" style="color: red;font-weight:bold;"></span><br>
						<label for="apellidos">Apellidos: </label><input type="text" id="apellidos" name="apellidos"><span id="er_ape" style="color: red;font-weight:bold;"></span><br>
						<label for="edad">Fecha Nacimiento: </label><br>
						<label for="mail">E-Mail: </label><input type="text" id="mail" name="mail"><br>
						<label for="username">Nombre Usuario: </label><input type="text" id="username" name="username"><br>
						<label for="password">Contraseña: </label><input type="password" id="password" name="password"><br>
						<input type="submit" value="enviar">

</fieldset>
</form>

jhz1983 · #2 (**permalink**) 16/05/2011, 09:45

seria una posible solución ... agregar un contador de errores y por ultimo hacer un if(errores!="0")
return false;

caricatos · #3 (**permalink**) 16/05/2011, 09:48

Hola:

Por lo que veo estás generando mensajes por cada error de validación (eso creo)

, así que una solución (es la que yo uso), es crear un array para los mensajes (en un principio vacío), y añadir un mensaje por cada nuevo error de validación...

var errores = [];
if (no_valida_email) errores.push("problemitas con el email...");
...

Luego si usas innerHTML (yo prefiero una alerta que obliga a responder)... pones algo así:

respuesta.innerHTML = errores.join("<br/>");
return (errores.length == 0);

Saludos

jhz1983 · #4 (**permalink**) 16/05/2011, 11:47

al final lo solucioné asi: supongo que es una forma como otra de hacerlo.. lo único que me planteo es si es la mejor forma de hacerlo... se puede hacer más simple quizás?

Código:

<script language="javascript">
	<!--
	function valida()
		{
		errores=0;
		if(!(document.registro.nombre.value.length>=4)&&(document.registro.nombre.value.length<=8))
				{
				if(document.registro.nombre.value.length=="0")
					{
					document.getElementById("er_name").innerHTML = (" &nbsp&nbsp Este campo no puede estar vacio.");
					errores++;
										}
					else {
						document.getElementById("er_name").innerHTML = (" &nbsp&nbsp Este campo a de tener entre 4 y 8 caracteres");
						errores++;

						}
				}

				if(document.registro.apellidos.value.length=="0")
				{
					document.getElementById("er_ape").innerHTML = (" &nbsp&nbsp Este campo no puede estar vacio");
					errores++;
				}
		if(errores!="0")
			{
			return false;
			}

			else
				return true;


		}
	//-->>
	</script>

	</head>
<body>
<h2>Datos personales</h2>
<br>
<form name="registro" method="post" onSubmit="return valida()">
<Fieldset style="margin:auto;">
	<legend>Registro nuevo usuario</legend>

						<label for="nombre">Nombre: </label><input type="text" id="nombre" name="nombre">  <span id="er_name" style="color: red;font-weight:bold;"></span><br>
						<label for="apellidos">Apellidos: </label><input type="text" id="apellidos" name="apellidos"><span id="er_ape" style="color: red;font-weight:bold;"></span><br>
						<label for="edad">Fecha Nacimiento: </label><br>
						<label for="mail">E-Mail: </label><input type="text" id="mail" name="mail"><br>
						<label for="username">Nombre Usuario: </label><input type="text" id="username" name="username"><br>
						<label for="password">Contraseña: </label><input type="password" id="password" name="password"><br>
						<input type="submit" value="enviar">

</fieldset>
</form>