CODEWITHSUNDEEP
javascriptphpjqueryhtmlajax
Abderrahim Gadmy
Abderrahim Gadmy

Reputation: 59

My $.post function doesn't return any data

I'm new to Php and Ajax, and I've been banging my head over this problem. I'm trying to get my simple form to update with ajax using the $.post shorthand function, but my script just doesn't return anything. I've tried with $.ajax as well, and used different data types like json objects, json variable, serialize() .. etc.

HTML

    <section class="contact" id="contact">



  <h2>Do you have a project in mind? Let's discuss it</h2>

    <div id="form-messages">

    </div>


   <form action="" method="post" id="contact-form">

        <div class="row">
            <div class="col span-1-of-4"><label for="name">Your name</label></div>
            <div class="col span-3-of-4"><input type="text" name="name" id="name" placeholder="Enter your name ..."></div>
        </div>

        <div class="row">
            <div class="col span-1-of-4"><label for="email">Your email</label></div>
            <div class="col span-3-of-4"><input type="email" name="email" id="email" placeholder="Enter your email ..."></div>
        </div>

        <div class="row">
            <div class="col span-1-of-4"><label for="message">Your message</label></div>
            <div class="col span-3-of-4"><textarea name="message" id="message" placeholder="Type in your message ..."></textarea></div>
        </div>

        <div class="row">
        <div class="col span-1-of-4"></div>
            <div class="col span-3-of-4"><input type="submit" name="submit" id="submit" value="Send your message"></div>

        </div>
    </form>




</section>

PHP 

<?php           

$name= $_POST['name'];
$email= $_POST['email'];
$message= $_POST['message'];
$error="";
$result="";

if (isset($_POST["submit"])) {
if (!$name) {
    $error="<br />Please enter your name";
}
if (!$email) {
    $error.="<br />Please enter your email address";
}
if (!$message) {
    $error.="<br />Please enter a message";
}

if ($_POST['email']!="" AND !filter_var($_POST['email'], FILTER_VALIDATE_EMAIL)) {
        $error.="<br />Please enter a valid email address";
    }                       
if ($error) {
    $result='<div class="error-message"><p id="alert"><strong>There were error(s) in your form:</strong>'.$error.'</p></div>';
} else {
    if (mail("[email protected]", "Gadmy Visions: Someone sent you a message!", 
    "Name: ". $_POST['name']."
    Email: ".$_POST['email']."
    Comment: ".$_POST['message'])) {
        $result='<div class="success-message"><p id="alert"><strong>Thank you!</strong> I\'ll be in touch</p></div>';
    } else {                                                 
        $result='<div class="error-message"><p id="alert">Sorry, there was an error sending your message. Please try again later.</p></div>';
    }
}

 echo $result;
}

?>

JS

$(document).ready(function(){
            $('#contact-form').on('submit',function(event){



    $.post('contact.php',$('form').serialize(), function(data){
        $('#form-messages').html(data);        
    });

    //Prevent refresh
    event.preventDefault();      

    });

});

Upvotes: 0

Views: 72

Answers (2)

Kep
Kep

Reputation: 5857

Long story short:

jQuery serialize() does not serialize buttons (since it doesn't know which button was used to submit the form). See: Link aswell as the jQuery serialize documentation:

Note: Only "successful controls" are serialized to the string. No submit button value is serialized since the form was not submitted using a button.

Since your PHP-File only generates output if $_POST["submit"] is set (which isn't the case since it's not serialized along with the rest of the form) nothing is actually returned.

Either use a different condition in your php file to check if the form was actually POSTed successfully or manually append the submit button to the serialized data.

Upvotes: 1

Kamal
Kamal

Reputation: 486

Try checking whether the form can be submitted by using

if($_SERVER['REQUEST_METHOD'] == "POST") instead of using isset($_POST["submit"])) .

Upvotes: 0

Related Questions