Tema: error contact form
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 06/11/2011, 20:49
emanuel_9614
 
Fecha de Ingreso: mayo-2011
Mensajes: 78
Antigüedad: 13 años, 6 meses
Puntos: 1
error contact form
Hola amigos del foro. Tengo un problema con el codigo. al ejecutarlo me salta el sig. error para cada text box: Notice: Undefined variable: error1 in ... index.php on line 45
Notice: Undefined variable: error2 in ... index.php on line 46 y haci susesivamente.
Pero dentro de los textbox dice: (el primero de ejemplo) <br /><b>Notice</b>: Undefined index: nombre in <b>index.php</b> on line <b>45</b><br />
Espero no haberlos entreveradoo. jee
Adjunto el codigo aver si pueden ayudarme. y desde ya muchas gracias.

index.php
Código PHP: 
Ver original
  1. <html>
  2.     <head>
  3.         <title>Contacto</title>
  4.         <link rel='stylesheet' href='estilos.css'>
  5.         <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js'></script>
  6.         <script src='funciones.js'></script>
  7.     </head>
  8.     <body>
  9.     <?php
  10.         if(isset($_POST['boton'])){
  11.             if($_POST['nombre'] == ''){
  12.                 $error1 = '<span class="error">Ingrese su nombre</span>';
  13.             }else if($_POST['email'] == '' or !preg_match("/^[a-zA-Z0-9_\.\-]+@[a-zA-Z0-9\-]+\.[a-zA-Z0-9\-\.]+$/",$_POST['email'])){
  14.                 $error2 = '<span class="error">Ingrese un email correcto</span>';
  15.             }else if($_POST['asunto'] == ''){
  16.                 $error3 = '<span class="error">Ingrese un asunto</span>';
  17.             }else if($_POST['mensaje'] == ''){
  18.                 $error4 = '<span class="error">Ingrese un mensaje</span>';
  19.             }else{          
  20.                 $dest = "[email protected]"; //Email de destino
  21.                 $nombre = $_POST['nombre'];
  22.                 $email = $_POST['email'];
  23.                 $asunto = $_POST['asunto']; //Asunto
  24.                 $cuerpo = $_POST['mensaje']; //Cuerpo del mensaje
  25.                 //Cabeceras del correo
  26.                 $headers = "From: $nombre $email\r\n"; //Quien envia?
  27.                 $headers .= "X-Mailer: PHP5\n";
  28.                 $headers .= 'MIME-Version: 1.0' . "\n";
  29.                 $headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n"; //
  30.                 
  31.                 if(mail($dest,$asunto,$cuerpo,$headers)){
  32.                     $result = '<div class="result_ok">Email enviado correctamente :)</a>';  
  33.                     // si el envio fue exitoso reseteamos lo que el usuario escribio:
  34.                     $_POST['nombre'] = '';
  35.                     $_POST['email'] = '';
  36.                     $_POST['asunto'] = '';
  37.                     $_POST['mensaje'] = '';
  38.                 }else{
  39.                     $result = '<div class="result_fail">Hubo un error al enviar el mensaje :(</a>';
  40.                 }
  41.             }
  42.         }
  43.     ?>
  44.         <form class='contacto' method='POST' action=''>
  45.             <div><label>Tu Nombre:</label><input type='text' class='nombre' name='nombre' value='<?php echo $_POST['nombre']; ?>'><?php echo $error1 ?></div>
  46.             <div><label>Tu Email:</label><input type='text' class='email' name='email' value='<?php echo $_POST['email']; ?>'><?php echo $error2 ?></div>
  47.             <div><label>Asunto:</label><input type='text' class='asunto' name='asunto' value='<?php echo $_POST['asunto']; ?>'><?php echo $error3 ?></div>
  48.             <div><label>Mensaje:</label><textarea rows='6' class='mensaje' name='mensaje'><?php echo $_POST['mensaje']; ?>'</textarea><?php echo $error4 ?></div>
  49.             <div><input type='submit' value='Envia Mensaje' class='boton' name='boton'></div>
  50.             <?php echo $result; ?>
  51.         </form>
  52.     </body>
  53. </html>

funciones.js
Código Javascript: 
Ver original
  1. $(function() { 
  2.     var emailreg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;   
  3.     $(".boton").click(function(){  
  4.         $(".error").fadeOut().remove();
  5.         
  6.         if ($(".nombre").val() == "") {  
  7.             $(".nombre").focus().after('<span class="error">Ingrese su nombre</span>');  
  8.             return false;  
  9.         }  
  10.         if ($(".email").val() == "" || !emailreg.test($(".email").val())) {
  11.             $(".email").focus().after('<span class="error">Ingrese un email correcto</span>');  
  12.             return false;  
  13.         }  
  14.         if ($(".asunto").val() == "") {  
  15.             $(".asunto").focus().after('<span class="error">Ingrese un asunto</span>');  
  16.             return false;  
  17.         }  
  18.         if ($(".mensaje").val() == "") {  
  19.             $(".mensaje").focus().after('<span class="error">Ingrese un mensaje</span>');   
  20.             return false;  
  21.         }  
  22.     });  
  23.     $(".nombre, .asunto, .mensaje").bind('blur keyup', function(){  
  24.         if ($(this).val() != "") {              
  25.             $('.error').fadeOut();
  26.             return false;  
  27.         }  
  28.     }); 
  29.     $(".email").bind('blur keyup', function(){  
  30.         if ($(".email").val() != "" && emailreg.test($(".email").val())) {  
  31.             $('.error').fadeOut();  
  32.             return false;  
  33.         }  
  34.     });
  35. });

estilo.css
Código CSS: 
Ver original
  1. *{
  2.     font-family: sans-serif;
  3.     font-size: 12px;
  4.     color: #798e94;
  5. }
  6. body{
  7.     width: 400px;
  8.     margin: auto;
  9.     background-color: #E2ECEE;
  10. }
  11. .contacto{
  12.     border: 1px solid #CED5D7;
  13.     border-radius: 6px;
  14.     padding: 45px 45px 20px;
  15.     margin-top: 50px;
  16.     background-color: white;
  17.     box-shadow: 0px 5px 10px #B5C1C5, 0 0 0 10px #EEF5F7 inset;
  18. }
  19. .contacto label{
  20.     display: block; 
  21.     font-weight: bold;
  22. }
  23. .contacto div{
  24.     margin-bottom: 15px;
  25. }
  26. .contacto input[type='text'], .contacto textarea{
  27.     padding: 7px 6px;
  28.     width: 294px;
  29.     border: 1px solid #CED5D7;
  30.     resize: none;
  31.     box-shadow:0 0 0 3px #EEF5F7;
  32.     margin: 5px 0;
  33. }
  34. .contacto input[type='text']:focus, .contacto textarea:focus{
  35.     outline: none;
  36.     box-shadow:0 0 0 3px #dde9ec;
  37. }
  38. .contacto input[type='text'].invalido, .contacto textarea.invalido{
  39.     box-shadow:0 0 0 3px #FFC9C9;
  40. }
  41. .contacto input[type='submit']{
  42.     border: 1px solid #CED5D7;
  43.     box-shadow:0 0 0 3px #EEF5F7;
  44.     padding: 8px 16px;
  45.     border-radius: 20px;
  46.     font-weight: bold;
  47.     text-shadow: 1px 1px 0px white;
  48.     
  49.     background: #e4f1f6; 
  50.     background: -moz-linear-gradient(top, #e4f1f6 0%, #cfe6ef 100%);
  51.     background: -webkit-linear-gradient(top, #e4f1f6 0%,#cfe6ef 100%); 
  52. }
  53. .contacto input[type='submit']:hover{
  54.     background: #edfcff; 
  55.     background: -moz-linear-gradient(top, #edfcff 0%, #cfe6ef 100%);
  56.     background: -webkit-linear-gradient(top, #edfcff 0%,#cfe6ef 100%); 
  57. }
  58. .contacto input[type='submit']:active{
  59.     background: #cfe6ef; 
  60.     background: -moz-linear-gradient(top, #cfe6ef 0%, #edfcff 100%);
  61.     background: -webkit-linear-gradient(top, #cfe6ef 0%,#edfcff 100%);
  62. }
  63. .error{
  64.     background-color: #BC1010;
  65.     border-radius: 4px 4px 4px 4px;
  66.     color: white;
  67.     font-weight: bold;
  68.     margin-left: 16px;
  69.     margin-top: 6px;
  70.     padding: 6px 12px;
  71.     position: absolute;
  72. }
  73. .error:before{
  74.     border-color: transparent #BC1010 transparent transparent;
  75.     border-style: solid;
  76.     border-width: 6px 8px;
  77.     content: "";
  78.     display: block;
  79.     height: 0;
  80.     left: -16px;
  81.     position: absolute;
  82.     top: 8px;
  83.     width: 0;
  84. }
  85. .result_fail{
  86.     background: none repeat scroll 0 0 #BC1010;
  87.     border-radius: 20px 20px 20px 20px;
  88.     color: white;
  89.     font-weight: bold;
  90.     padding: 10px 20px;
  91.     text-align: center;
  92. }
  93. .result_ok{
  94.     background: none repeat scroll 0 0 #1EA700;
  95.     border-radius: 20px 20px 20px 20px;
  96.     color: white;
  97.     font-weight: bold;
  98.     padding: 10px 20px;
  99.     text-align: center;
  100. }