Form Html+JS+Php

elburdel · #1 (**permalink**) 25/12/2010, 18:58

Antes que nada creo este tema aca porque no sabía bien donde ponerlo.

Les cuento lo que quiero hacer: Un formulario en html, que me envie los datos por php y que cuando php me envio los datos me aparezca una ventana de javascript que diga "Mensaje enviado". El formulario me anda barbaro, me procesa los datos pero lo que me ocurre es lo siguiente cuando completo el formulario y hago clic en enviar, me tira un mensaje de alerta y cuando le doy aceptar me carga la pagina donde tengo el formulario, ami no me gustaria que me la cargue ya que es una pagina en blanco y queda mal, se entiendo mas o menos?

pueden comprobarlo aca:
www.matiasclemente.com.ar/presupuesto.html

Un abrazo!

Lo que hice fue esto: Tengo este formulario en html

Código HTML:

<form method="post" action="presupuesto.php">
Nombre<input type="text" name="nombre" id="nombre" />
Email <input type="text" name="mail" id="mail" />
Mensaje:
<textarea name="mensaje" id="mensaje" cols="45" rows="2"></textarea>
 <input type="submit" name="button" id="button" value="Solicitar Presupuesto">
</form>

Código PHP:

  <?  
 
$nombre = $_POST['nombre']; 
$mail = $_POST['mail']; 
$mensaje = $_POS['mensaje']; 
$header = 'From: ' . $mail . " \r\n"; 
$header .= "X-Mailer: PHP/" . phpversion() . " \r\n"; 
$header .= "Mime-Version: 1.0 \r\n"; 
$header .= "Content-Type: text/plain"; 
 
$mensaje = "Este mensaje fue enviado por " . $nombre . ", su mail es: " . $mail . " \r\n"; 
$mensaje .= "Su e-mail es: " . $mail . " \r\n"; 
$mensaje .= "Su mensaje es:: " . $_POST['mensaje'] . " \r\n"; 
$mensaje .= "Enviado el " . date('d/m/Y', time()); 
$para = '[email protected]'; 
$asunto = 'Contacto desde Mi Web'; 
 
mail($para, $asunto, utf8_decode($mensaje), $header); 
?> 
<html><head> 
 
<script type="text/javascript"> 
               
              window.onload = function(){  
              var input = document.getElementById('button'); 
 
input.onclick = function () {alert ("La solicitud de presupuesto ha sido enviada"); 
   } 
} 
 
</head>

maycolalvarez · #2 (**permalink**) 26/12/2010, 12:06

NOTAS:
-usa <?php debido a que los short tags (<?) están depreciados en futuras versiones de php
-para evitar que la pagina se recargue puedes recurrir a técnicas como AJAX, o simplemente utilizar un iframe oculto que sirva como el target del form, así no se recargará la página (esto es una forma de AJAX antiguo)
-debes de implementar un CAPTCHA para evitar que tu formulario sea una fuente de SPAM

elburdel · #3 (**permalink**) 27/12/2010, 16:58

No entendi porque deberia hacer lo que me recomendabas de Captcha, nunca tuve problema a la hora de enviar un formulario, siempre me han llegado.

walterdevel · #4 (**permalink**) 27/12/2010, 17:01

Cita:

Iniciado por elburdel

No entendi porque deberia hacer lo que me recomendabas de Captcha, nunca tuve problema a la hora de enviar un formulario, siempre me han llegado.

El problema no es que lleguen o no, el problema es el spam de hackers o robots. Con eso te asuguras bastante de que es un humano el que esta enviando el formulario. Te recomiendo recaptcha si decides usar uno.

elburdel · #5 (**permalink**) 28/12/2010, 20:02

Ok, lo voy a tener en cuenta.
Te hago una pregunta a vos y a cualquiera que lo lea.

Lo que se me ocurrio hacer es que en la misma pagina de mi formulario, este mi codigo php y en la misma pagina validado con JS.
Las validaciones no me funcionan, me gustaria saber si me pueden ayudar ya que no logro encontrar el error.

Al comienzo del html lo valido con Javascript

Código PHP:

  <script type="text/javascript"> 
        function ValidarEnvioMail(){ 
    Campo = document.getElementById("nombre"); 
    if (Campo.value =='') { 
      alert ("El Campo Nombre es obligatorio"); 
      return false; 
    } 
    campo = document.getElementById("mail"); 
    if    (Campo.value =='') { 
    alert("El campo mail es obligatorio"); 
    } 
        formulario.submit();        
  }

Luego tengo el formulario en html

Código HTML:

<form id="formulario" name="formulario" method="post" action="">
<em><strong>Nombre</strong></em>
<input type="text" name="nombre" id="nombre" />
<em><strong>Email</strong></em>
<input type="text" name="mail" id="mail" />
<em><strong>Telefono</strong></em>
<input type="text" name="telefono" id="telefono" />
<input type="submit" name="enviar" id="enviar" value="Enviar Mensaje" onClick="ValidarEnvioMail()" >

Y abajo de ese boton enviar creo esta funcion Javascript para que cuando se haga clic en enviar me muestre un mensaje de "mensaje enviado"

Código PHP:

      <script type="text/javascript"> 
                  window.onload = function(){  
  var input = document.getElementById('enviar'); 
 
input.onclick = function () {alert ("La solicitud de presupuesto ha sido enviada, a la brevedad nos comunicaremos con usted."); 
   } 
} 
</script>

El problema esta en que si le doy clic en enviar con todos los espacios en blanco, me tira el mensaje de "mensaje enviado". Cuando me deberia decir "Ingrese el campo nombre ya que es obligatorio" Y si le saco la ultima parte del codigo, es decir el JS que esta debajo del boton enviar. Me valida el campo nombre, pero no el mail.
Espero que me puedan ayudar.

Saludos!