Question

Buenas. Estoy creando un formulario de contacto y tengo un problema. La cosa está en que no controlo mucho de javascript y es donde tengo el error que no consigo ver........
Se que esta en el archivo javascript por que si lo quito me envía el email correctamente. Pero con el archivo javascript me envía el email, pero es como si no recogiese los datos del post, del formulario, y me lo envía vacío. Pero la cosa está en que necesito este código javascript. Es el que hace que salga un mensajito en la parte superior del formulario informando que se ha enviado correctamente. Sin el me redirige a una página en blanco con el mensaje de información.
Como ya he dicho al ser javascript no se ver el fallo. Pongo el código a ver si alguien lo sabe ver:

// Contact form validation
    var form = $('.contact-form');
    form.submit(function () {'use strict',
        $this = $(this);
        $.post($(this).attr('action'), function(data) {
            $this.prev().text(data.message).fadeIn().delay(3000).fadeOut();
        },'json');
        return false;
    });

Entonces, con este código me hace bien lo del mensajito informando que se ha enviado, y me lo envía, pero el email en blanco.
Sin este código me envía bien el email, con todos los datos del post, pero se me va a una página en blanco con el mensajito. Y se queda ahí......
Gracias por la ayuda.

Comments

Hola @nachito777sk,

hace falta que agregues el código HTML del formulario para poder ver el error.

Al final de tu pregunta haces referencia aun "email en blanco"... pero un formulario envía datos a GET o POST a un URL, no envía un email. Podrías aclarar un poco más esto?

Answer 1

Hola, después de mucho probar (como dije no javascript no es mi especialidad) ya he solucionado el problema. Como decía carlossevi, en el método post, no enviaba nada, me faltaba los datos he enviar. Yo lo enviaba así:

$.post("sendemail.php, function(data) {

$this.prev().text(data.message).fadeIn().delay(3000).fadeOut();
        },'json');

Cargaba la URL y llamaba a la función con lo que quería hacer. En mi caso lo correcto era, después de llamar a la URL(sendemail.php), enviar los datos que se iban a cargar en esta URL, y después llamar a la función, de esta manera:

$.post("sendemail.php", {name: document.getElementById("name").value, email: document.getElementById("email").value, message: document.getElementById("message").value}, function(data) {

$this.prev().text(data.message).fadeIn().delay(3000).fadeOut();
        },'json');

Como veis, recoge el los valores del formulario para enviarlos. La documentación que me pasaste me ha venido muy bien.
Gracias por la ayuda...

Answer 2

Tienes razón, esto no lo explique bien. A ver si así se entiende mejor:
Este es el apartado del formulario de contacto del HTML:

<div class="col-sm-5">
                        <div id="contact-section">
                            <h3>Contacta con nosotros</h3>
                            <div class="status alert alert-success" style="display: none"></div>
                            <form id="main-contact-form" class="contact-form" name="contact-form" method="post" action="sendemail.php">
                                <div class="form-group">
                                    <input type="text" name="name" class="form-control" required="required" placeholder="Nombre">
                                </div>
                                <div class="form-group">
                                    <input type="email" name="email" class="form-control" required="required" placeholder="Email">
                                </div>
                                <div class="form-group">
                                    <textarea name="message" id="message" required="required" class="form-control" rows="4" placeholder="Mensaje"></textarea>
                                </div>                        
                                <div class="form-group pull-right social-icons">
                                    <input type="submit" class="btn btn-primary pull-right" value="Enviar"</input>
                                    <a href="https://twitter.com/noisy_app" target="_blank" style="font-size: 55px; color: #373737"><i class="fa fa-twitter"></i></a>
                                    <a href="https://www.facebook.com/Noisy-508280102683678" target="_blank" style="font-size: 55px; color: #373737; padding-right: 30px"><i class="fa fa-facebook"></i></a>
                                </div>

                            </form>        
                        </div>

Esto lo envía, como tu bien dices a otra URL, que es un archivo que se llama sendemail.pnp que es este:

<?php
    header('Content-type: application/json');
    $status = array(
        'type'=>'success',
        'message'=>'Gracias por contactar con nosotros. Nos pondremos en contacto con usted lo antes posible '
    );

    $name = @trim(stripslashes($_POST['name'])); 
    $email = @trim(stripslashes($_POST['email'])); 
    $subject = @trim(stripslashes($_POST['subject'])); 
    $message = @trim(stripslashes($_POST['message'])); 

    $email_from = $email;
    $email_to = '[email protected]';//replace with your email

    $body = 'Name: ' . $name . "\n\n" . 'Email: ' . $email . "\n\n" . 'Subject: ' . $subject . "\n\n" . 'Message: ' . $message;

    $success = @mail($email_to, $subject, $body, 'From: <'.$email_from.'>');

    echo json_encode($status);
    die;

La cosa está en la función javascript que como dije hace que enseñe el mensajito en el mismo formulario que es este:

// Contact form validation
    var form = $('.contact-form');
    form.submit(function () {'use strict',
        $this = $(this);
        $.post($(this).attr('action'), function(data) {
            $this.prev().text(data.message).fadeIn().delay(3000).fadeOut();
        },'json');
        return false;
    });

Answer 3

Lo que hace la pieza de Javascript a grandes rasgos:

1. Envía una petición POST con jQuery a sendemail.php (realmente la envía a la URL del atributo action del elemento que devuelve el selector css .contact-form).
2. Hace una animación con un elemento del HTML poniendo antes el texto del mensaje que devuelve la petición POST.
3. Evita que el envío del formulario mediante el método "tradicional".

El problema que tienes es que en esa petición no estás enviando ningún dato del formulario, por lo que tu script de PHP no tiene ningún parámetro POST y genera un email vacío.

Answer 4

Hola @nachito777sk,

concuerdo con lo que dice @carlossevi.

Para debuguearlo y ver qué pasa, modificá sendmail.php de la siguiente manera:

<?php
    header('Content-type: application/json');
    $status = array(
        'type'=>'success',
        'message'=>"Debug {$_POST['name']} - {$_POST['email']} - {$_POST['subject']} - {$_POST['message']}"
    );
...

De esta manera vas a ver los valores que recibe tu script desde el formulario.

Si el código que pusiste por acá está completo, lo que yo creo que pasa es que el formulario no tiene un elemento llamado "subject" y por esto el script PHP falla al querer acceder a una posición inexistente del vector POST... tal vez sea solo eso, pero si no es, podés ir agregando valores al array que es la respuesta para poder ir viendo dónde falla.

Saludos!