Joe Consterdine Joe Consterdine - 1 month ago 22
Javascript Question

AJAX open error

getting this error, not sure why... thanks :)


uncaught InvalidStateError: Failed to execute 'send' on 'XMLHttpRequest': The object's state must be OPENED.


$(document).ready(function(){
var request = new XMLHttpRequest();

request.onreadystatechange = function(){
if(request.readyState === 4) {
console.log("4 request");
if(request.status === 200) {
$(".container").innerHTML = request.responseText;
console.log("200 request");
}
}
};

request.open('GET', 'bio.txt', true);

$("#send-btn").on("click", function(){
request.send();
});
});

Answer

XMLHttpRequest objects go through a number of different states.

After you call request.open it goes into the OPENED state.

When you click the button it goes through the later states and ends up as DONE.

When you click the button again it is DONE and not OPENED so you get the error.


Create the XHR object (and call open etc on it) inside the click event handler.

Comments