Javascript：postAjax不发布任何内容

Question

Good Morning!

I am writing a small AJAX application, using this function as a base, and php as serve side language.

here is the javascript code involved

var dati = {};
dati.nome = d.getElementById('nome').value;
dati.cognome = d.getElementById('cognome').value;
console.log(dati);
url = "post.php";
jsonToPost = dati;
console.log(url);

processResponse = function(responseText){
    console.log(responseText);
    d.getElementById('response').innerHTML = responseText;
}
_SU3.postAjax(url, processResponse, jsonToPost);
});

And here is my php code, just a post processor to test ajax

<?php
if(isset($_POST['nome'])){

$nome = $_POST['nome'];
$cognome = $_POST['cognome'];
$data['nome'] = $nome;
$data['cognome'] = $cognome;

$data = json_encode($data);

echo $data;
} else {
    echo "Errore!";
}
?>

The response I get from the ajaxRequest is "Errore!", it means it's not posting anything to the script.

Am I missing any obvious mistake? Or there is something i'm doing completely wrong?

The _SU3.ajax() function (see this for reference) is working just fine, so i'm surprised it doesn't work

---edit to ad the firebug response--- I hope i posted the right thing

request headers:
POST /~francesco/post.php HTTP/1.1
Host: localhost
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.8; rv:16.0) Gecko/2010010 Firefox/16.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: it-IT,it;q=0.8,en-US;q=0.5,en;q=0.3
Accept-Encoding: gzip, deflate
Connection: keep-alive
Content-Type: application/x-www-form-urlencoded; charset=UTF-8
Referer: http://localhost/~francesco/ajax.html
Content-Length: 26
Pragma: no-cache
Cache-Control: no-cache

Screenshot in the screen shot there are other informations.

Answer 1

You might want to replace the line:

ajaxRequest.send("data=" + encodeURIComponent(data));

In _SU3.postAjax to:

ajaxRequest.send(data);

And then send the third argument (jsonToPost) as a string like this:

"nome=arg1&cognome=arg2"

For example:

"nome="+d.getElementById("nome").value + "&cognome="+d.getElementById("cognome").value`

Answer 2

As puckipedia suggested, you need to encode the object you are sending as a query string. The following method will create the parameter string based on the object passed in:

_SU3.postAjax = function(url, callback, data) {

   var parameters = '';

   for (var p in data){
     parameters  += p + '=' + encodeURIComponent(data[p]) + '&';
   }

   var ajaxRequest = _SU3.getAjaxRequest(callback);
   ajaxRequest.open("POST", url, true);
   ajaxRequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
   ajaxRequest.setRequestHeader("Connection", "close");
   ajaxRequest.send(parameters);
}

The function suggested in the link you provided was assuming you were passing in JSON, not a js object.

Note: The server code you posted should interpret the data properly:

$nome = $_POST['nome'];