$ .post不向php脚本发送数据

Question

Okay I am at a loss for what is going wrong. I am trying to pass the form data to my php script from a simple jQuery script but for some reason when I try to access $_POST data php says that $_POST is empty?

Here we go, so I have the following jQuery and php scripts

jQuery

var post = $('#cform').serialize();
console.log("POST DATA: " + post);
$.post(action, post, function(data){
    document.getElementById('message').innerHTML = data;
    $('#message').slideDown('slow');
    $('#cform img.contact-loader').fadeOut('slow',function(){$(this).remove()});
    $('#submit').removeAttr('disabled');
    if(data.match('success') != null) $('#cform').slideUp('slow');
 });

PHP

$fname  = $_POST['fname'];
$lname  = $_POST['lname'];
$email = $_POST['email'];
$phone = $_POST['phone'];
$comments = $_POST['comments']; 

The console log of var post looks like this

POST DATA: fname=Daniel&lname=Jarvis&email=test%40gmail.com&phone=4444444444&comments=hello

And the var_dump of $_POST says this

array(0) { } 

I have no clue why this is giving me so many problems so any help would be greatly appreciated.

PS I have also tried simply doing this for the post data but it still was not working.

var post = {fname: $('#fname').val(), lname: $('lname').val(), ...} //you get the idea

The console.log looked like this

{fname: "Dan", lname: "Jarvis", ...}

But when I var_dumped the $_POST variable it still said

array(0) { } 

Answer 1

*There are several issues in your code,

1.Add event which will trigger ajax.

2.Your php script does not echo any data.

3.No return false or prevent defaul to stop form submission manually.(I think this is the main issue)

check the solution:*

HTML:

    <form id="form">

    <input type="text" name="fname">
    <input type="text" name="lname">
    <input type="text" name="email">
    <input type="text" name="phone">
    <input type="text" name="comments">
    <input type="submit" name="submit" value="submit">

    </form>

    <span id="message"></span>

Javascript:

    $("#form").submit(function(){

        var post = $('#form').serialize();
        console.log("POST DATA: " + post);
        $.post('target.php', post, function(data){
        document.getElementById('message').innerHTML = data;
        $('#message').slideDown('slow');
        $('#cform img.contact-loader').fadeOut('slow',function(){$(this).remove()});
        $('#submit').removeAttr('disabled');
        if(data.match('success') != null) $('#cform').slideUp('slow');

     });
    return false;
    })

PHP(I assume that your php script is target.php):

  $fname  = $_POST['fname'];
  $lname  = $_POST['lname'];
  $email = $_POST['email'];
  $phone = $_POST['phone'];
  $comments = $_POST['comments']; 

  echo $fname.$lname.$email.$phone.$comments;