Consulta formulario JQuery

[augusftw]

Buenos días gente soy nuevo en el foro.

Les comento me baje un template que trae un formulario de contacto aparentemente en jquery (que poco entiendo de esto) y el tema es que no logro hacerlo andar. El formulario avisa correctamente cuando alguien no pone su nombre, o no pone un mensaje, o su e-mail, pero cuando ingresas todo como corresponde y tocas el boton submit no pasa nada.

Bueno les dejo el código haber donde está fallando o que es lo que hace falta.

1. El código en la web HTML:

Código:

          <h3 class="contactTitle">Formulario de contacto:</h3>
          <!-- custom form messages start -->
          <span class="error" id="nameError">Porfavor ingresa tu nombre </span> <span class="error" id="emailError">Porfavor ingresa tu e-mail </span> <span class="error" id="emailError2">Please ingresa un e-mail valido </span> <span class="error" id="messageError">Porfavor ingresa tu mensaje </span>
          <div class="contactSuccessMessage"> <img src="images/ok.png" alt=""/>
            <h4>Gracias por contactarnos.</h4>
          </div>
          <!-- custom form messages end -->
          <!-- contact form start -->
          <div class="contactForm" id="contactForm">
            <form id="contact">
              <fieldset>
                <label for="contactName" id="name_label">Name (required)</label>
                <input type="text" name="contactName" id="contactName" size="30" value="" class="text-input" />
                <label for="contactEmail" id="email_label">Email (required)</label>
                <input type="text" name="contactEmail" id="contactEmail" size="30" value="" class="text-input" />
                <label for="contactSubject" id="subject_label">Subject </label>
                <input type="text" name="contactSubject" id="contactSubject" size="30" value="" class="text-input" />
                <label for="contactMessage" id="message_label">Message (required)</label>
                <textarea  name="contactMessage" id="contactMessage" class="text-input"></textarea>
                <p>
                  <input type="submit" name="submitMessage" class="contactButton" id="contactSubmitBtn" value=""/>
                </p>
              </fieldset>
            </form>
          </div>
          <!-- contact form end -->

1. El archivo JS Script dentro de una carpeta que contiene los archivos del sitio web.

Código:

jQuery(function() {
  jQuery('.error').hide();
  jQuery('.contactSuccessMessage').hide();
  jQuery(".contactButton").click(function() {
		// validate and process form
		// first hide any error messages
    jQuery('.error').hide();
		
	  var name = jQuery("input#contactName").val();
		if (name == "") {
      jQuery("span#nameError").fadeIn(500);
      jQuery("input#contactName").focus();
      return false;
    }
	  var email = jQuery("input#contactEmail").val();
	  if (email == "") {
      jQuery("span#emailError").fadeIn(500);
      jQuery("input#contactEmail").focus();
      return false;
    }
	
	var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
	if(!emailReg.test(email)) {
	jQuery("span#emailError2").fadeIn(500);
    jQuery("input#contactEmail").focus();
      return false;
	}
	var subject = jQuery("input#contactSubject").val();
	
	  var msg = jQuery("textarea#contactMessage").val();
	  if (msg == "") {
	  jQuery("span#messageError").fadeIn(500);
	  jQuery("textarea#contactMessage").focus();
	  return false;
    }
		
		var dataString = 'name='+ name + '&email=' + email + '&subject=' + subject + '&msg=' + msg;
		//alert (dataString);return false;
		
	  jQuery.ajax({
      type: "POST",
      url: "php/mail.php",
      data: dataString,
      success: function() {
       jQuery("#contactForm").hide();
	   jQuery(".contactSuccessMessage")
        .fadeIn(1500);
      }
     });
    return false;
	});
});

Mi idea es que el formulario mande un email a la dirección [email protected] con los datos ingresados en el formulario.

Gracias desde ya.
Saludos.

[Naahuel]

Asumimos que contás con el archivo en "php/mail.php" que en sí es el encargado de enviar el email...

[augusftw]

Hola Nahuel. Nop no cuento con ese archivo, solamente estas dos cosas que postie. Podrías indicarme como tendría que armarlo? o que tendría que contener ese archivo?

Gracias!

[Naahuel]

Y ese archivo es el que envía el email, es un poquito importante :P

Creá un archivo mail.php dentro de una carpeta llamada php con el siguiente contenido:

Código PHP:

<?php
    //quien recibe el email
    $recipient  = "[email protected]";
    
    //obtengo las variables por POST o GET
    $name       = $_REQUEST['name'];
    $email      = $_REQUEST['email'];
    $subject    = $_REQUEST['subject'];
    $message    = $_REQUEST['msg'];
    
    //abro el mensaje
    $HTML = '<html><body>';
    
    //creo el mensaje
    $HTML.= '<h1>Nuevo mensaje</h1>';
    $HTML.= "<p><strong>Nombre: </strong> $name</p>";
    $HTML.= "<p><strong>Email: </strong> $email</p>";
    $HTML.= "<p><strong>Mensaje: </strong> $message</p>";   
    
    //cierro el mensaje
    $HTML.= "</body></html>";
 
    
    //envío el email
    sendHTMLemail($HTML,$email,$recipient,$subject);
    
    
    //funcion para envio de email con formato
    function sendHTMLemail($HTML,$from,$to,$subject)
    {
        $headers = "From: $from\n"; 
        $headers .= "MIME-Version: 1.0\n";
        $boundary = uniqid("HTMLEMAIL"); 
        $headers .= "Content-Type: multipart/alternative;".
                    "boundary = $boundary\n\n"; 
 
        $headers .= "This is a MIME encoded message.\n\n"; 
 
        $headers .= "--$boundary\n".
                    "Content-Type: text/plain; charset=ISO-8859-1\n".
                    "Content-Transfer-Encoding: base64\n\n"; 
                    
        $headers .= chunk_split(base64_encode(strip_tags($HTML))); 
        $headers .= "--$boundary\n".
                    "Content-Type: text/html; charset=ISO-8859-1\n".
                    "Content-Transfer-Encoding: base64\n\n"; 
                    
        $headers .= chunk_split(base64_encode($HTML)); 
        return mail($to,$subject,"",$headers);
        
    }
    
?>
 

Ese es un código PHP para enviar emails que uso casi siempre. Como verás es fácil de personalizar y tiene la ventaja de que el email que envías es con formato HTML.

Acá lo podés ver funcionando: http://nahueljose.com.ar/temp/
Debería enviarte un mail a la dirección que proporcionaste.

Todo esto asumiendo que estás en un servidor que soporta PHP y qué se yo.

[augusftw]

Gracias loco. Hice la prueba recien, y el formulario al completarlo y tocar Submit me tira el comentario "Gracias por contactarnos." (que antes no lo hacía) pero cuando me fijo la casilla de correo no me ha enviado el mensaje :s que puede ser ?

[Naahuel]

Iniciado por augusftw

Gracias loco. Hice la prueba recien, y el formulario al completarlo y tocar Submit me tira el comentario "Gracias por contactarnos." (que antes no lo hacía) pero cuando me fijo la casilla de correo no me ha enviado el mensaje :s que puede ser ?

Pues a mí me funciona bárbaro, el email me llega bien. El código que te pasé está funcionando. Revisá que no sea otra cosa, o poné el código acá.

[zeandesign]

Utiliza este code con esto jala brother!

Código PHP:

<?php
 
$EmailFrom = "[email protected]";
$EmailTo = "[email protected]";
$Subject = "Correo v&iacute;a web;
$name = Trim(stripslashes($_POST['name'])); 
$email = Trim(stripslashes($_POST['email'])); 
$message = Trim(stripslashes($_POST['message'])); 
 
 
 
$Body = 'Datos'."\n";
$Body .= "Nombre: "; $Body .= $name; $Body .= "\n";
$Body .= "Email: "; $Body .= $email; $Body .= "\n";
$Body .= "Mensaje: "; $Body .= $message; $Body .= "\n";
 
 
$success = mail($EmailTo, $Subject, $Body, "From: <$EmailFrom>");
 
 
?>
 

[juaniquillo]

Iniciado por augusftw

Gracias loco. Hice la prueba recien, y el formulario al completarlo y tocar Submit me tira el comentario "Gracias por contactarnos." (que antes no lo hacía) pero cuando me fijo la casilla de correo no me ha enviado el mensaje :s que puede ser ?

¿estás probando el script php en un servidor que tenga un servidor SMTP?