Ajax call with ONLY javascript (no jquery)

Question

I'm trying to do an ajax call with POST method, but the PHP only return an empty array. What am i doing wrong?

JAVASCRIPT

// ajax call

function makeRequest(){

    var http_request = false;
    // example data
    var fileObjectInfo = 'bla';
    var url = 'archivo.php';

    if (window.XMLHttpRequest){
        http_request = new XMLHttpRequest();
        if (http_request.overrideMimeType) {
            http_request.overrideMimeType('text/xml');
        }
    }else if(window.ActiveXObject){
        try{
            http_request = new ActiveXObject("Msxml2.XMLHTTP");
        }catch(e){
            try{
                http_request = new ActiveXObject("Microsoft.XMLHTTP");
            }catch(e){}
        }
    }

    if (!http_request) {
        console.log('Falla :( No es posible crear una instancia XMLHTTP');
        return false;
    }


    http_request.onreadystatechange = alertContents;
    http_request.open('POST', url, true);
    http_request.send(fileObjectInfo);


    function alertContents(){

        if (http_request.readyState == 4) {
            if (http_request.status == 200) {

                console.log(http_request.responseText);

            } else {
                console.log('Hubo problemas con la petición.');
            }
        }
    }
}

My php only do: <?php print_r($_POST); ?> (i tried with request too), but always return an emty array. (so the call works but javascrip doesn't send the information, no?)

I get examples code from internet but never works the ajax call with POST method and i don't know why.

thank you in advance for all the help they can lend.

Possible duplicate of [Sending POST data with a XMLHttpRequest](http://stackoverflow.com/questions/9713058/sending-post-data-with-a-xmlhttprequest) — Alex Blex, Nov 20 '15 at 10:07
really i try to send a JavasCript Object, but when it doesn't work i tried with a string — Hugo Ferreras, Nov 20 '15 at 10:38
I read this tutorial to do my script: http://blog.teamtreehouse.com/uploading-files-ajax — Hugo Ferreras, Nov 20 '15 at 10:59

score 0 · Answer 1 · answered Nov 20 '15 at 10:01

0

If You request post method you must be pass header data with request like

http_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http_request.setRequestHeader("Content-length", fileObjectInfo.length);
http_request.setRequestHeader("Connection", "close");

put this data before http_request.send(fileObjectInfo);

I hope this will help you

answered Nov 20 '15 at 10:01

user3136856

29
2

Thanks for the help but it doesn't works, it still return an empty array, no changes. – Hugo Ferreras Nov 20 '15 at 10:10
Please refer the basic example code http://www.w3schools.com/ajax/tryit.asp?filename=tryajax_post2 it will help you – user3136856 Nov 20 '15 at 10:16
In the example i don't understand why they use the post method and next send the information using get "xhttp.send("fname=Henry&lname=Ford");" – Hugo Ferreras Nov 20 '15 at 10:26
In simple javascript ajax post method always pass the query string in send function if you use get in ajax query string pass after url – user3136856 Nov 20 '15 at 10:49
post and get method rule in ajax is if you want to get data from server you can use get method if you submit more data to server you can user post method this is standardized rule – user3136856 Nov 20 '15 at 10:53
and hoy i send a object, y tried with '?data='+Object but in php only return data ={} – Hugo Ferreras Nov 20 '15 at 10:55
Please check php file i think problem in your php file – user3136856 Nov 20 '15 at 12:12
How can i get a problem with print_r($_REQUEST)? (i prove $_POST, var_dump), What's wrong? – Hugo Ferreras Nov 20 '15 at 12:25

score 0 · Answer 2 · answered Apr 14 '16 at 16:25

To send a POST request you need a form data object containing key value pairs for PHP to interpret post values

var fileObjectInfo = new FormData();
fileObjectInfo.append("key", "value");
fileObjectInfo.append("name", "prince");

// ajax code
http_request.send(fileObjectInfo);

In PHP then do this

echo $_POST["key"];
echo $_POST["name"];

Be sure to check if the post params exist using isset()

Ajax call with ONLY javascript (no jquery)

2 Answers2