Not getting post values

Question

I'm using this script to send an e-mail from a contact form. I get the e-mail but the infos are empty, i tried "echoing" the post values but it won't, what am I missing? I think it's probably something wrong in my HTML form but I can't see it.

sendemail.php

$status = array(
    'type'=>'success',
    'message'=>'Thank you for contact us. As early as possible  we will contact you '
);

$nome = addslashes($_POST['name']);
$email = addslashes($_POST['email']);
$tel = addslashes($_POST['telephone']);
$subject = addslashes($_POST['subject']);
$msg = addslashes($_POST['message']);

$para = "*******@gmail.com";
$body = "Nome: " .$nome. "\nE-mail: " .$email. "\nTelefone: " .$tel. "\nMensagem: " .$msg;

$header = "From: contact@*******.com.br"."\r\n"."Reply-To: ".$email."\r\n"."X-Mailer: PHP/".phpversion();

$success = mail($para, $subject, $body, $header);

echo json_encode($status);

form page html

<section id="contact-page">
    <div class="container">
        <div class="center">        
            <h2>Deixe sua mensagem</h2>
        </div> 
        <div class="row contact-wrap"> 
            <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="col-sm-5 col-sm-offset-1">
                        <div class="form-group">
                            <label>Nome *</label>
                            <input type="text" name="name" class="form-control" required="required">
                        </div>
                        <div class="form-group">
                            <label>Email *</label>
                            <input type="email" name="email" class="form-control" required="required">
                        </div>
                        <div class="form-group">
                            <label>Telefone</label>
                            <input type="phone" name="telephone"class="form-control">
                        </div>                       
                    </div>
                    <div class="col-sm-5">
                        <div class="form-group">
                            <label>Assunto *</label>
                            <input type="text" name="subject" class="form-control" required="required">
                        </div>
                        <div class="form-group">
                            <label>Mensagem *</label>
                            <textarea name="message" id="message" required="required" class="form-control" rows="8"></textarea>
                        </div>                        
                        <div class="form-group">
                            <button type="submit" name="submit" class="btn btn-primary btn-lg" required="required">Enviar</button>
                        </div>
                    </div>
                </form> 
        </div>
    </div>
</section>

AJAX in JS:

var form = $('#main-contact-form');
form.submit(function(event){
    event.preventDefault();
    var form_status = $('<div class="form_status"></div>');
    $.ajax({
        url: $(this).attr('action'),

        beforeSend: function(){
            form.prepend( form_status.html('<p><i class="fa fa-spinner fa-spin"></i> Email is sending...</p>').fadeIn() );
        }
    }).done(function(data){
        form_status.html('<p class="text-success">' + data.message + '</p>').delay(3000).fadeOut();
    });
});

use your browser's web console to see if it's sending post values — Tim Morton, May 31 '17 at 03:24
your code is actually working, does it redirect to sendemail page after you click submit? — ryo7689, May 31 '17 at 03:39
@TimMorton I don't think it is sending post value, but I can't see any solution for that — Luc, May 31 '17 at 12:26
Does the page refresh on submit? Is there a javascript observer watching the submit button? I ask because the script is responding with json, so it's probably called via ajax. — Tim Morton, May 31 '17 at 12:32
@TimMorton The page doesn't refresh but when you hit submit it shows loading and then a message of success in this div: — Luc, May 31 '17 at 13:07
Sounds like you have javascript that is intercepting the submit and then sending it via ajax. Find that code and post it. — Tim Morton, May 31 '17 at 14:56
@TimMorton Even if the only JS in my project is the one from Bootstrap ? — Luc, May 31 '17 at 15:28
well, somehow the javascript is not finding the right values. So the question is how is it gathering the information to submit? That'll be found in the js code. Search for the observer that is firing on the submit button. — Tim Morton, May 31 '17 at 15:36
@TimMorton Ok, I found it, it's added, can you help me out? I'm not really used to AJAX. If it helps I created another form where it doesn't call that js and it works, so what is wrong with this code? Thank you very much. — Luc, Jun 01 '17 at 01:55
Yup, that clinches it. We know the JavaScript is executing, it's just not sending the variables via POST. I'll have to brush up on Ajax too. Where'd you get the script? It seems to be missing some lines — Tim Morton, Jun 01 '17 at 02:50
@TimMorton Actually I got this bootstrap theme called "Corlate" and just changed the html content, but php script and js are untouched. — Luc, Jun 01 '17 at 02:56
I'm going to have to come back to this later; I'm done for the night :) In the meantime try googling how to send post by Ajax and hopefully you can find what this script is missing. I'll check in to this tomorrow. — Tim Morton, Jun 01 '17 at 03:05

Tim Morton · Accepted Answer · 2017-06-02T03:20:27.443

By default, ajax is sent via the GET method. This JavaScript code does not specify POST method; so although the PHP script was called, it never received any data.

var form = $('#main-contact-form');
form.submit(function(event){
    event.preventDefault();
    var form_status = $('<div class="form_status"></div>');
    $.ajax({
        url: $(this).attr('action'),

        beforeSend: function(){
            form.prepend( form_status.html('<p><i class="fa fa-spinner fa-spin"></i> Email is sending...</p>').fadeIn() );
        }
    }).done(function(data){
        form_status.html('<p class="text-success">' + data.message + '</p>').delay(3000).fadeOut();
    });
});

The updated script would look something like this (see jQuery AJAX submit form):

var form = $('#main-contact-form');
form.submit(function(event){
    event.preventDefault();
    var form_status = $('<div class="form_status"></div>');
    $.ajax({
        url: $(this).attr('action'),
        type: "POST",    
        data: form.serialize(), // serializes the form's elements.
        beforeSend: function(){
            form.prepend( form_status.html('<p><i class="fa fa-spinner fa-spin"></i> Email is sending...</p>').fadeIn() );
        }
    }).done(function(data){
        form_status.html('<p class="text-success">' + data.message + '</p>').delay(3000).fadeOut();
    });
});

Yeeeeeaaaa!! That worked, thank you so much my friend! – Luc Jun 01 '17 at 21:27 — Luc, Jun 01 '17 at 21:27

Not getting post values

1 Answers1