Page 1 of 1
XMLHttpRequest with post [SOLVED]
Posted: Wed Nov 09, 2005 9:55 am
by Moocat
I'm just getting into AJAX and I've figured out generally how to work with it and the GET method, but being the paranoid person I am, I want to try and get the POST method working as well. I haven't been able to figure it out though, here is my code:
Code: Select all
var http = createRequestObject();
function sndReq(action) {
http.open('post', 'rpc.php');
http.onreadystatechange = handleResponse;
http.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
http.send(action);
}
It's sending a variable to the next page with a parameter name of 'POST_DATA' and the correct value (action = foo) but I can't seem to interpret the variable correctly on the next page. I would also like to figure out how to name the paramater name something other than 'POST_DATA' if possible. Here is my last try at getting the results:
Code: Select all
<?
switch($_POST['POST_DATA']) {
case 'foo':
echo "foo|<img src=alucard.jpg>";
break;
case 'foo2':
echo "foo|foo2 yeah";
break;
case 'foo3':
echo "foo|foo3 woot";
break;
}
?>
Thanks for any/all help!

Posted: Wed Nov 09, 2005 10:31 am
by Weirdan
Ajax: Getting started wrote:
Note that if you want to POST data, you have to change the MIME type of the request using the following line:
http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
Otherwise, the server will discard the POSTed data.
Posted: Wed Nov 09, 2005 11:10 am
by Moocat
I tried this:
Code: Select all
var http = createRequestObject();
function sndReq(action) {
http.open('post', 'rpc.php');
http.onreadystatechange = handleResponse;
http.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
http.send(action);
}
and this
Code: Select all
var http = createRequestObject();
function sndReq(action) {
http.open('post', 'rpc.php');
http.onreadystatechange = handleResponse;
http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
http.send(action);
}
I have no doubt I'm missing something here
P.S. This is the error I'm getting from the javascript console:
"Error: document.getElementById(update[0]) has no properties
Source File: http://localhost/tests.php
Line: 37"
Here is the code from that area:
Code: Select all
function handleResponse() {
if(http.readyState == 4){
var response = http.responseText;
var update = new Array();
if(response.indexOf('|' != -1)) {
update = response.split('|');
document.getElementById(update[0]).innerHTML = update[1];
}
}
}
I'm not sure which area the error is actually occuring though.
Posted: Wed Nov 09, 2005 1:30 pm
by Weirdan
add
to make sure the update array is filled correctly
btw, 'post' should be capitalized, thus:
Posted: Thu Nov 10, 2005 7:28 am
by Moocat
You are right, I'm not catching the data sent correctly. Here is the PHP I have for the 'action' page:
Code: Select all
<?
switch($_POST['POST_DATA']) {
case 'foo':
echo "foo|foo moot";
break;
case 'foo2':
echo "foo|foo2 yeah";
break;
case 'foo3':
echo "foo|foo3 woot";
break;
default:
echo "foo|foo4 default";
break;
}
?>
It only catches on the default (which I have just put in). I have 3 links which pass in the different variables which I can get to work with GET or REQUEST but the name for the post data eludes me. Looks like this should be the last pointer I need, suggestions?
Posted: Thu Nov 10, 2005 9:25 am
by Moocat
Yah, I figured it out!
I had to pass the variable through the JS as follows:
After doing that I could easily read it on the PHP side using the normal:
Thanks for all your help

Posted: Thu Nov 10, 2005 9:33 am
by Burrito
that's correct. You'll need to send mulitiple parameters the same way you would a get string as well.
ex:
Code: Select all
var postString = "var1="+jsvar1+"&var2=someString&var3="+jsvar3;
http.send(postString);
Posted: Thu Nov 10, 2005 11:25 am
by onion2k
Slight tangent .. would it be possible to upload a file using POST and XMLHttpRequest?
Posted: Thu Nov 10, 2005 2:31 pm
by feyd
technically, it's possible.. but painful to do.. highly not recommended.