这是 jQuery 错误吗？ $.post 与 $.ajax

Question

UPDATE: my code may be confusing and contain errors. But here is what I'm trying to do with both $.ajax and $.post ----I want to send JSON to php and receive plain text. But $_POST is empty<-why?-----

I found the $_POST to be empty if I use $.ajax, but contains the right content when using $.post Update: Requirement-- I need to use a JSON request. But problem is $_POST is empty in php, see Var_dump This is my script

    <script>
    $(document).ready(function(){
        $("#submit").click(function(){
            $.ajax({
                type: "POST",
                url: "Ajax_example.php",
                data: {"field": $("#field").val()},
                contentType: "application/json; charset=utf-8", 
                success: function(msg){
                    alert("NEW DATA:"+msg);
                }
            });
    /*      $.post("Ajax_example.php", {"field": $("#field").val()}, 
                    function(msg){
                        alert("NEW DATA:"+msg);
                    });*/
            return false;
        })

    });
    </script>

This is my php

    <?php

    echo var_dump($_POST);


    ?>

With the above, $.post portion are comments. With the $.ajax portion running, it alerts out only "NEW DATA:" But If I do it the other way around, I will get whatever I put in #field

Answer 1

You're using $.ajax() incorrectly. The data parameter to $.ajax is wrapped in a string. Try this:

$.ajax({
    type: "POST",
    url: "Ajax_example.php",
    data: {field: $("#field").val() },
    success: function(msg){
        alert("NEW DATA:"+msg);
    }
});

Answer 2

In the section which you say is not working, you're going through great lengths to make a string for your data, but in the section you say is working you are passing an object literal (preferred). Fix the $.ajax section to pass an object literal as the data option.

You're also passing a contentType option, but no dataType option. Use either of the versions in the code block below:

$( function()
{
    $( '#submit' ).click( function( e )
    {
        /**
          THIS
         */
        $.ajax( {
            type: 'POST',
            url: 'Ajax_example.php',
            data: {
                field: $( '#field' ).val()
            }
            success: function( msg )
            {
                alert( 'NEW DATA:' + msg );
            },
            dataType: 'json'
        } );

        /**
          IS THE SAME AS THIS
         */
        $.post( // type implied in method name
            // url
            'Ajax_example.php',
            // data
            {
                field: $( '#field' ).val()
            },
            // success
            function( msg )
            {
                alert( 'NEW DATA:' + msg );
            },
            // dataType
            'json'
        );

        /**
          DON'T RETURN FALSE...CONTROL YOUR EVENT INSTEAD
         */
        e.preventDefault();
    } );
} );

Answer 3

Your data is in $receive variable, not $_POST. Try:

<?php
    $receive=file_get_contents('php://input');
    $receive=json_decode($receive, TRUE);
    echo $receive['field'];
?>