evilnapsis/valid-a-form.html

## valid-a-form.html
<!DOCTYPE html>
<html>
<head>
	<title>Validar un formulario</title>
</head>
<body>
<h1>Validar un formulario con PHP</h1>
<form method="post" action="procesar.php" id="procesar" name="procesar">
<div>
	<label for="nombre">Nombre: </label>
	<input type="text" name="nombre" id="nombre">
</div>
<div>
	<label for="apellidos">Apellidos: </label>
	<input type="text" name="apellidos" id="apellidos">
</div>
<div>
	<label for="email">Email: </label>
	<input type="text" name="email" id="email">
</div>
<div>
	<label for="password">Password: </label>
	<input type="password" name="password" id="password">
</div>
<div>
	<label for="confirm">Confirmar password: </label>
	<input type="password" name="confirm" id="confirm">
</div>
<div>
	<input type="submit" id="submit" value="Procesar">
</div>
</form>

<script type="text/javascript">

	function validarEmail(email)
	{
	    var re = /\S+@\S+\.\S+/;
	    return re.test(email);
	}
		var form = document.procesar;

	document.procesar.onsubmit = function(e){
		var ready = false;

		if(form.nombre.value!="" && form.apellidos.value!=""&& form.email.value!=""&& form.password.value!="" && form.confirm.value!=""){
			ready = true;
		}else{
				ready= false;
				alert("Hay algunos campos vacios");
				e.preventDefault();
		}

		if(ready){
			if(validarEmail(form.email.value)){
				if(form.password.value==form.confirm.value){
					ready = true;
				}else{
					ready= false;
					alert("El password y la confirmacion no coinciden");
					form.password.focus();
					e.preventDefault();
				}
			}else {
					alert("El email no tiene un formato valido!");
					form.email.focus();
					e.preventDefault();
			}
		}

	}
</script>

</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<title>Validar un formulario</title>
	</head>
	<body>
	<h1>Validar un formulario con PHP</h1>
	<form method="post" action="procesar.php" id="procesar" name="procesar">
	<div>
	<label for="nombre">Nombre: </label>
	<input type="text" name="nombre" id="nombre">
	</div>
	<div>
	<label for="apellidos">Apellidos: </label>
	<input type="text" name="apellidos" id="apellidos">
	</div>
	<div>
	<label for="email">Email: </label>
	<input type="text" name="email" id="email">
	</div>
	<div>
	<label for="password">Password: </label>
	<input type="password" name="password" id="password">
	</div>
	<div>
	<label for="confirm">Confirmar password: </label>
	<input type="password" name="confirm" id="confirm">
	</div>
	<div>
	<input type="submit" id="submit" value="Procesar">
	</div>
	</form>

	<script type="text/javascript">

	function validarEmail(email)
	{
	var re = /\S+@\S+\.\S+/;
	return re.test(email);
	}
	var form = document.procesar;

	document.procesar.onsubmit = function(e){
	var ready = false;

	if(form.nombre.value!="" && form.apellidos.value!=""&& form.email.value!=""&& form.password.value!="" && form.confirm.value!=""){
	ready = true;
	}else{
	ready= false;
	alert("Hay algunos campos vacios");
	e.preventDefault();
	}

	if(ready){
	if(validarEmail(form.email.value)){
	if(form.password.value==form.confirm.value){
	ready = true;
	}else{
	ready= false;
	alert("El password y la confirmacion no coinciden");
	form.password.focus();
	e.preventDefault();
	}
	}else {
	alert("El email no tiene un formato valido!");
	form.email.focus();
	e.preventDefault();
	}
	}

	}
	</script>

	</body>
	</html>