javascriptjqueryxmlhttprequestactivexobjectreadystate

Load ~ 400 (Bad Request). XmlHttpRequest works on local, but not on server-side


I am working on async load (using XMLHttpRequest .readystate & .responseText) of product table contents on pagination or filter changing. Funtions I wrote work perfectly but on local only. On apache/ngnix server-side it returns bad request. Please help.

function loadContent(link) {

    var http = createRequestObject();
    if( http ) {

        http.open('load', link);
        http.onreadystatechange = function () {

            if(http.readyState == 4) {

                var div = document.createElement('div');
                div.innerHTML = http.responseText;
                var all = div.getElementsByTagName('div');

                for (var i = 0, len = all.length; i < len; i++) {

                   if (all[i] && all[i].getAttribute('id') == 'to-ajax') {

                      var deep = all[i].getElementsByClassName('product-layout col-lg-4');
                      $('.load').before(deep);

                   }
                }
            }
        }

        http.send(null);

    } else {

        document.location = link;

    }
}

function createRequestObject() {
    try { return new XMLHttpRequest() }
    catch(e) {
        try { return new ActiveXObject('Msxml2.XMLHTTP') }
        catch(e) {

            try { return new ActiveXObject('Microsoft.XMLHTTP') }
            catch(e) { return null; }
        }
    }
}

Error warning refers to this line of code ~ } http.send(null);

It seems that problem is on .onreadystatechange function, but have no idea how to test it to define what an exact issue is.


Solution

  • The first argument to open needs to be a string containing an HTTP request method. "load" is not an HTTP request method. Examples include "GET" and "POST". The invalid HTTP is likely causing your server to respond with the Bad Request error.