$_POST is empty even though I can see the $_POST data in firebug post, html, and response tabs

Question

So I'm grabbing the state of a jquery date picker and a dropdown select menu and trying to send those two variables to another php file using AJAX.

var_dump($_POST);

results in this on the webpage:

    array(0) {
   }

BUT, when I look at the Net panel in Firebug, I can see the POST and GET urls and it shows the Post, Response, and HTML all showing the variables that I sent to the PHP file, but when dumping, it shows nothing on the page.

I've been looking through other similar issues on SO that has led me to changing the php.ini file to increase the post size and to updating my ajax call to use json objects and then parse through it on the php side.

Currently I'm just trying to get passing a string to work, and my code looks like this:

AJAX:

  $("#submit_button").click(function() {
    // get date if selected
    var selected_date = $("#datepicker").datepicker("getDate");
    // get show id if selected
    var selected_dj = $("#show-list").val();
    // put the variables into a json object
    var json = {demo : 'this is just a simple json object'};
    // convert to json
    var post_data = JSON.stringify(json);
    // now put in variable for posting
    var post_array = {json : post_data};

    $.ajax({
      type: "POST",
      url: template_dir + "/get-show-logs.php",
      data: post_array,
      success: function(){
          alert("Query Submitted");
      },
      error: function(xhr, ajaxOptions, thrownError){
        alert(xhr.status);
        alert(thrownError);
      }
    });  

    // clear div to make room for new query
    $("#archived-posts-container").empty();
    // now load with data
    $("#archived-posts-container").load(template_dir + "/get-show-logs.php #get_logs");

  });

Now this is the php that's running from the .load() call, and where I'm trying to access the $_POST variables:

get-show-logs.PHP:

<div id="get_logs">

    <?php 

    if(isset($_POST["json"])){
        $json = stripslashes($_POST["json"]);
        $output = json_decode($json);

        echo "im here";
        var_dump($output);

        // Now you can access your php object like so
        // $output[0]->variable-name
    }

    var_dump(getRealPOST());


    function getRealPOST() {
        $pairs = explode("&", file_get_contents("php://input"));
        $vars = array();
        foreach ($pairs as $pair) {
            $nv = explode("=", $pair);
            $name = urldecode($nv[0]);
            $value = urldecode($nv[1]);
            $vars[$name] = $value;
        }
        return $vars;
    }

    ?>

</div>

You can see that I'm trying just accessing the $_POST variable, and the isset check isn't passing, (the page isn't echoing "im here"), and then I'm also trying parsing through the input myself, and that is also empty.

the output on the page looks like this:

array(1){[""]=>string(0)""}

BUT, once again, the Firebug Net panel shows the following under the Response tab:

    <div id="get_logs">

    im hereobject(stdClass)#1 (1) {
    ["demo"]=>
     string(33) "this is just a simple json object"
   }
   array(1) {
     ["json"]=>
     string(44) "{"demo":"this is just a simple json object"}"
   }

    </div>

I'm not sure what could be causing the issue, the Firebug can see it, but the php file sees an empty array.

Now I'm very new at using ajax and $_POST and such, so if you read anything that you're not 100% sure about, don't assume that I know anything about it! Speak up! haha. Also, I'm doing this with MAMP on Localhost, so I'm not sure if that leads to any issues.

Thanks for the help in advance!

Answer 1

You aren't using the response in your AJAX call currently. See this example which will output the returned response to the console.

$.ajax({
      type: "POST",
      url: template_dir + "/get-show-logs.php",
      data: post_array,
      success: function(response){
          console.log(response);
      },
      error: function(xhr, ajaxOptions, thrownError){
        alert(xhr.status);
        alert(thrownError);
      }
    });

Success
Type: Function( Anything data, String textStatus, jqXHR jqXHR ) A function to be called if the request succeeds. The function gets passed three arguments: The data returned from the server, formatted according to the dataType parameter or the dataFilter callback function, if specified; a string describing the status; and the jqXHR (in jQuery 1.4.x, XMLHttpRequest) object.

-http://api.jquery.com/jquery.ajax/

Also this might be a good page to read more about jQuery and AJAX, https://learn.jquery.com/ajax/jquery-ajax-methods/.