$_POST variable is empty when MIME type JSON is used

[nayakswadesh]

Below is an excerpt from my pet project.

//JS
    xmlhttp.onreadystatechange=function() {
        if (xmlhttp.readyState==4 && xmlhttp.status==200) {
            console.log(xmlhttp.responseText);
        }
    }
    var mac_data=new Object();
    mac_data.ipaddress_eth0=document.getElementById('ipnic0_txt').value;
    mac_data.owner=document.getElementById('owner_txt').value;
    var json_data=JSON.stringify(mac_data);
    xmlhttp.open("POST","php/addMachine.php",true);
    xmlhttp.setRequestHeader('Content-Type', 'application/json')
    xmlhttp.send(json_data);

//PHP
var_dump ($_POST);
header("Content-Type: application/json");

The value of $_POST (as seen in firebug) is "array(0) {}".
I am unable to figure out the problem with this piece of code.
Please guide me.

[BluePanther]

Are they on the same page? PHP and Javascript don't talk to each other. If they're on the same page, the PHP POST array won't have anything in it, as it won't be populated on the server - as the javascript hasn't run yet because it runs on the client side.

To clarify. PHP is executed by the server, so the server will parse all the headers sent from the browser, fill the relevant information out into the relevant constants and arrays, then run the PHP script. The script then parses and outputs the script, and included in the output should be the javascript. That means the javascript is run after the PHP starts outputting - after PHP has finished doing it's thang.

Have a rethink about your logic .

[nayakswadesh]

When you ask me whether they are on the same page, do you mean same file?
Let me clarify on the way my code is organized. Below is the directory structure


ls /var/ww/html
css data exe FirePHPCore-0.3.2 index.html js json php
ls /var/www/html/js
addMac.js
ls /var/www/html/php
addMachine.php


Few lines from index.html (not the entire page).
There is a button on the page too which listens to Click event and calls the JS function.

                </div>
                    <span id="ipnic0_label">IP Address NIC 0</span>
                    <input type="text" id="ipnic0_txt" />
                </div>
                <div>
                    <span id="owner_label">Owner</span>
                    <input type="text" id="owner_txt" />
                </div>

Few lines from addMac.js (not the entire page)

    var mac_data=new Object();
    mac_data.ipaddress_eth0=document.getElementById('ipnic0_txt').value;
    mac_data.owner=document.getElementById('owner_txt').value;
    var json_data=JSON.stringify(mac_data);
    console.log(json_data);
    xmlhttp.open("POST","php/addMachine.php",true);
    xmlhttp.setRequestHeader('Content-Type', 'application/json')
    xmlhttp.send(json_data);

Few lines from addMachine.php (not the entire page)

var_dump ($_POST);
header("Content-Type: application/json");

I am able to make this work using a "get" request. But the POST is not working for me.