AJAX XMLHttpRequest POST

Question

I'm trying to write an XMLHttpRequest using the POST method. I have managed to use XMLHttpRequest in the past using the GET method but am struggling with POST.

Here's my code:

var xmlhttp = null;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp = new XMLHttpRequest();
}
else
{// code for IE6, IE5
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}

var url = "http://www.mysite.com/script.php";
var params = "var=1";
xmlhttp.open("POST", url, true);
xmlhttp.send(params);

It basically calls a PHP script which then adds some information to a database.

There is no error, and according to Chrome Inspector the code is fine. — diggersworld, Nov 25 '10 at 11:35

Marcel Korpel · Answer 1 · 2012-05-26T11:11:16.570

49

You forgot to explicitly set to Content-type header, which is necessary when doing POST requests.

xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

Also, do not forget to use encodeURIComponent to properly encode your parameters, e.g.:

var params = "var=" + encodeURIComponent("1");

(in this particular example, it's not necessary, but when using special characters like + things will go horribly wrong if you don't encode the parameter text).

Update – you should also replace all instances of %20 with +, like

var params = params.replace(/%20/g, '+');

edited May 26 '12 at 11:11

answered Nov 25 '10 at 11:16

Marcel Korpel

21,536
6
60
80

Tried adding content type and encoding but the processing script still sin't being called. – diggersworld Nov 25 '10 at 11:35
@diggers: What does the processing script look like? Can you modify your question to include that? – Marcel Korpel Nov 25 '10 at 11:43
@vp_arth https://stackoverflow.com/questions/7718476/are-http-headers-content-type-c-case-sensitive – Marcel Korpel Mar 26 '14 at 15:38
@MarcelKorpel, :) my php doesn't recognize post data with `Content-type` I spent 2hours to looking for why my `$_POST` and `$_REQUEST` arrays are empty, possible it is php bug, but there is... (`PHP 5.4.9-4ubuntu2.4 (cli)`) – vp_arth Mar 26 '14 at 19:54
@vp_arth I just did a quick test with a POST variable and my console correctly output the sent variable contents. Tested locally using PHP 5.5.10. You can try this yourself by cloning [this repository](https://github.com/marcelkorpel/xhr-test) and opening `xhr-test.html`. – Marcel Korpel Mar 27 '14 at 23:08
@MarcelKorpel, thanks. I write my log to https://github.com/marcelkorpel/xhr-test/issues/1 – vp_arth Mar 28 '14 at 09:24
1. how do i encode multiple parameter? do i need to encode '&' ? 2. Do I need to decode the data on script.php . If so then how? one end using javascript encoding, should i use php decode related functions for this purpose – Rajib Nov 23 '17 at 13:17
@Rajib 1. You need to encode each parameter and operand separately. You certainly shouldn't encode `=` and `&`, because then they are supposed to be part of the parameter or operand. 2. No, you do not need to decode on the server side. – Marcel Korpel Nov 24 '17 at 16:28

score -6 · Accepted Answer · answered Nov 25 '10 at 11:53

-6

Okay I've managed to sort it.

Odd reason though, might be sandbox security related, but rather than have the full URL address, I have just used the relative path to the file, and now it works.

Thank you all for your support.

answered Nov 25 '10 at 11:53

diggersworld

12,770
24
84
119

AJAX XMLHttpRequest POST

2 Answers2

Linked