
15/02/2008, 01:16
|
 | Moderador extraterrestre | | Fecha de Ingreso: diciembre-2001 Ubicación: Madrid
Mensajes: 6.987
Antigüedad: 23 años, 2 meses Puntos: 61 | |
Re: Validando Formulario con Div!! Espero que esto te sirva
Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Untitled</title>
<style>
.izquierda{
float:left;
position:Relative;
}
#formulario{
border:solid 1px black;
width:170px;
padding:10px;
text-align:right;
}
input{
border:solid 1px black;
}
#avisos{
background-color:#efefef;
display:none;
margin-left:10px;
padding:10px;
border:solid 1px black;
}
*{
font:normal 10px/15px verdana;
}
</style>
<script>
colorMal="#ffff99";
colorBien="ffffff";
function validar(f){
mensaje="";
for(a=0;a<f.elements.length;a++){
if(f[a].type=="text" && f[a].value==""){
f[a].style.backgroundColor=colorMal; //Pone el color de fondo de error en el campo
mensaje+="El campo "+f[a].name+" no puede quedar vacío.<br />"; //Añade texto al mensaje que aparecerá
}
else{
f[a].style.backgroundColor=colorBien; //Pone el color normal al campo que está bien
}
}
if(mensaje!=""){ //La variable mensaje sólo estará vacía si no hay ningún fallo
document.getElementById("avisos").innerHTML="Por favor, corrija los siguientes errores:<br />"+mensaje+" Muchas gracias." //Se introduce el texto en la capa de alertas
document.getElementById("avisos").style.display='block'; //Hacemos que aparezca la capa de alertas
return false;
}
else{
document.getElementById("avisos").style.display='none'; //Si no hay fallos la oculta
}
}
</script>
</head>
<body><div class="izquierda" id="formulario">
<form action="javascript:alert('Esta todo bien!');" onsubmit="return validar(this)">
Nombre:<input type="text" name="nombre" id="nombre" /><br />
Edad:<input type="text" name="edad" id="edad" /><br />
<input type="submit" name="mandar" id="mandar" value="Enviar" />
</div>
<div class="izquierda" id="avisos"></div>
</body>
</html>
Un saludo!
__________________ Cómo escribir
No hay pregunta tonta, sino tonto que quiere seguir en la ignorancia. |