Ajax ready state : 0 always in javascript

Question

This the part of my code where I create the request. ( I do not want to use jquery)

var xr = new XMLHttpRequest();
console.log(xr);
xr.onreadystatechange = function () {
    console.log(xr.readyState,xr.status);
    if(xr.readyState == 4 && xr.status == 200) {
        var data=xr.responseText;
        alert(data.innerHTML);
        console.log(data);
    }
    var params ="param1="+movieName+"&param2"+movieGenre ;
    xr.open("GET","./saveMovie.php"+"?"+params,true);
    xr.send();
}

Answer 1

You need to open and sed the XHR outside the callback function.

var xr = new XMLHttpRequest();
console.log(xr);
xr.onreadystatechange = function () {
    console.log(xr.readyState,xr.status);
    if(xr.readyState == 4 && xr.status == 200) {
        var data=xr.responseText;
        alert(data.innerHTML);
        console.log(data);
    }
}
var params ="param1="+movieName+"&param2"+movieGenre ;
xr.open("GET","./saveMovie.php"+"?"+params,true);
xr.send();