Ejemplo en ejecución:
https://googledrive.com/host/0BxfUn2LNLVPebTNaNk96cVJYV00/contacto.html
Enlace para descargar ejemplo:
https://googledrive.com/host/0BxfUn2LNLVPeUlMtZmJxbkxqT1U/ejemplo_formulario_contacto.zipCódigo HTML
<!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">
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<meta name="generator" content="PSPad editor, www.pspad.com">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Formulario de Contacto</title>
<script src="SpryAssets/SpryValidationTextField.js" type="text/javascript"></script>
<script src="SpryAssets/SpryValidationTextarea.js" type="text/javascript"></script>
<link href="SpryAssets/SpryValidationTextField.css" rel="stylesheet" type="text/css" />
<link href="SpryAssets/SpryValidationTextarea.css" rel="stylesheet" type="text/css" />
<link type="text/css" rel="stylesheet" href="miCSS.css" />
</head>
<body>
<center>
<div id="head" class="cabecera">
<h1>EJEMPLO DE FORMULARIO CONTACTO</h1>
</div>
<div id="div1" style="font-family:Tahoma; border:3px outset gray;
padding:15px; text-align:center; margin:20px" width="800px" height="100px" class="lateral" >
<form method="post" name="contacto" action="contacto.php" >
<table width="500" border="1" align="center" cellspacing="2px">
<tr>
<th colspan="2" align="center" scope="row">ENVIA TU COMENTARIO</th>
</tr>
<tr>
<th width="78" height="23" align="left" scope="row">Nombre</th>
<td width="406"><label for="nombre"></label>
<span id="sprytextfield1">
<input name="nombre" type="text" id="nombre" size="50" />
<span class="textfieldRequiredMsg">Se necesita un valor<br />
</span><span class="textfieldMinCharsMsg"> <br />
No se cumple el minimo de caracteres requerido.</span> <br />
</span></td>
</tr>
<tr>
<th align="left" scope="row">Correo</th>
<td><label for="correo"></label>
<span id="sprytextfield2">
<input name="correo" type="text" id="correo" size="40" />
<br />
<span class="textfieldRequiredMsg">Se necesita un valor.</span>
<span class="textfieldInvalidFormatMsg">Formato no valido.</span>
<span class="textfieldMinCharsMsg">No se cumple el minimo de caracteres requerido.</span>
</span>
</td>
</tr>
<tr>
<th align="left" scope="row">Comentario</th>
<td><label for="comentario"></label>
<span id="sprytextarea1">
<textarea name="comentario" id="comentario" cols="48" rows="5"></textarea>
<span class="textareaRequiredMsg">Se necesita un valor.</span>
<span class="textareaMinCharsMsg">No se cumple el minimo de caracteres requerido.</span>
<span class="textareaMaxCharsMsg"><br />
Se ha superado el numero maximo de caracteres.</span></span></td>
</tr>
<tr>
<th colspan="2" align="center" scope="row"><p>
<input type="submit" name="enviar" id="enviar" value="Enviar Comentario" />
</p></th>
</tr>
</table>
</form>
<script type="text/javascript">
var sprytextfield1 = new Spry.Widget.ValidationTextField("sprytextfield1", "none", {validateOn:["blur", "change"], minChars:3, maxChars:60});
var sprytextfield2 = new Spry.Widget.ValidationTextField("sprytextfield2", "email", {validateOn:["blur"], minChars:3, hint:"micorreo@gmail.com"});
var sprytextarea1 = new Spry.Widget.ValidationTextarea("sprytextarea1", {minChars:5, maxChars:500, validateOn:["blur"]});
</script>
</div>
</center>
</body>
</html>
Código CSS
#div2 {border:4px inset purple;
padding:20px;
margin:20px 60px;
text-align:letf;
font-family:Arial;
}
div{
color:teal;
}
.lateral {
font-size: 18px;
background-color:silver;
}
Código PHP
<?php
$nombre = $_POST["nombre"];
$correo = $_POST["correo"];
$comentario = $_POST["comentario"];
$header = 'From: ' . $correo . "\r\n";
$header.= "Content-Type: text/plain";
echo "Nombre:". $nombre."<br>";
echo "Correo:". $correo."<br>";
echo "Comentario:". $comentario."<br>";
if(mail("pavillalta@ugb.edu.sv", "comentarios de:".$nombre, $comentario, $header)){
?>
<script type="text/javascript">
alert("Correo enviado");
document.location.href = "contacto.html";
</script>
<?php
}
?>
No hay comentarios:
Publicar un comentario
Gracias por su comentario