Question

i am having trouble getting this XMLHttpRequest to work properly, this is my first time using ajax so i’m not sure if i’m formatting everything correctly. i have looked all over the web and i keep finding basically the same info and examples but certain elements are in different orders so i’m not sure which is correct and i’ve tried them all and nothing seems to work. here is my code:

function ajaxRequest(){
    var activexmodes=["Msxml2.XMLHTTP", "Microsoft.XMLHTTP"]
    if (window.XMLHttpRequest)
        return new XMLHttpRequest()
    else if (window.ActiveXObject){ 
        for (var i=0; i<activexmodes.length; i++){
            try{
                return new ActiveXObject(activexmodes[i])
            }
            catch(e){
                //suppress error
            }
        }
    }
    else
        return false
}
function getData(fileName){
    var fileLoc =encodeURI("assets/"+fileName+".html")
    alert(fileLoc)
    var request = new ajaxRequest()
    request.open("GET",fileLoc,true)
    var response = request.responseText
    alert(request.status)
    alert(response)
    request.send(null)
    return response
}
function home() {
    var data = getData("home")
    var contentDiv = document.getElementByClassName(content)
    contentDiv.innerHTML = data;
}

home is triggered when the user clicks on a div in the page. i know that getData is being accessed because the alerts pop up, however i get a status code of 0, this happened on both my local machine and on a live server. i read that localhosts can throw a 0 status regardless of the actual status but its happening on a live server as well. if someone could help me fix this issue and/or clarify the correct order of events in the function i would greatly appreciate it.

EDIT:
new code:

function getData(fileName){
    fileLoc = encodeURI("assets/"+fileName+".html")
    alert(fileLoc);
    request.onreadystatechange = processData;
    request.open("GET",fileLoc, false);
    request.send();
    alert(request.readyState);
    alert(response);
}
function processData(){
    if (request.readyState==4){
        if (request.status==200){
            document.getElementsByClassName('content').innerHTML = request.responseText;
        }
        else{
            alert("An error has occured making the request");
        }
    }
}

Answer 1

You are telling XMLHTTPRequest to send the request asynchronous, which means the rest of your script gets executed while you wait for the response. You will get a reponse code 0 (uninitialized) and an empty response, because at the time you return from the function that is the current status and response.

Instead you want to define a function to call when the state changes, or let XMLHTTPRequest work synchronous.

Please refer to this tutorial for a simple example that should help you out.