ajax php javascript : error when using POST method

Question

I searched on google, and there are so much question about this topic on stackoverflow. Such as 'data not being sent on post method', etc. But seem not asnwer my question

The case is almost the same with other questions. These are the error msg:

Firefox (v21) :

InvalidStateError: An attempt was made to use an object that is not, or is no longer, usable.
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');

Chrome (v27) :

Uncaught Error: InvalidStateError: DOM Exception 11

When the request is sent by GET, there is no error. And all GET data received well.

But when sent by POST + setRequestHeader, itu occurs error like above. When setRequestHeader removed, the error is gone. No error, but the POST data is not received. i print_r($_POST); then the array is empty

Question Updated. Here is the caller:

goServer({
    url     : 'users/sign-in.php',
    method  : 'POST',
    data    : 'randomId=' + randomId + '&name=' + name + '&password=' + password,
    done    : function(response) {
        alert(response);
    },
    fail    : function(response) {
        alert(response);
    }
});

And here is the functions (sorry, long lines ):

function randomString() {
    var str = new Date().getTime(),
    str2    = Math.random();

    str     = str.toString();
    str2    = str2.toString();
    str2    = str2.substring(2,7);
    str     += str2;

    return str;
}



function goServer(opts) {
    var xhr    = new XMLHttpRequest();
    xhr.onreadystatechange = requestComplete;

    function requestComplete() {
        if ( xhr.readyState === 4 ) {
            if ( xhr.status === 200 ) {
                opts.done(xhr.responseText);
            } else {
                opts.fail(xhr.responseText);
            }
        }
    }

    if ( !opts.method || opts.method === undefined ) {
        opts.method    = "GET";
    }

    if ( !opts.cache || opts.cache === undefined ) {
        opts.cache    = false;
    }

    if ( opts.cache === false ) {
        opts.url    += '?nocache=' + randomString();
    } else {
        opts.url    += '?nocache=false';
    }

    if ( opts.method === "GET" ) {
        if ( opts.data !== '' && opts.data !== undefined ) {
            opts.url    += '&' + opts.data;
        }
        opts.data    = '';
    } else {
        xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
    }

    xhr.open(opts.method, opts.url, true);
    xhr.send(opts.data);

}

Note, the data parameter (opts.data) is set to the url when it sent by GET. When sent by POST, the paramater is set to the xhr.send(opts.data);

Question : How to get the POST data correctly?

Thank you

print_r(file_get_contents('php://input')); < Your POST data here. But it not solves an issue. Post code please. — BlitZ
– BlitZ, Commented Jun 19, 2013 at 4:28

Musa · Accepted Answer · 2013-09-25 11:46:26Z

12

Call xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); after you call xhr.open

Also opts.data should be a string containing key/value pairs. e.g. key=value&method=post

edited Sep 25, 2013 at 11:46

answered Jun 19, 2013 at 4:35

Musa

97.9k17 gold badges123 silver badges144 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Bagus Javas Over a year ago

Whoaaa, you are true Sir! You are true, yes, problem solved. Thank you so much

Bagus Javas Over a year ago

As you said, call setRequestHeader('Content-type', 'application/x-www-form-urlencoded') after xhr.open and it works! Again, thank you very much, sir!

Collectives™ on Stack Overflow

ajax php javascript : error when using POST method

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related