store XMLHttpRequest.responseText as variable :(

Question

<script language="javascript" type="text/javascript">

try{
    // Opera 8.0+, Firefox, Safari
    ajaxRequest = new XMLHttpRequest();
} catch (e){
    // Internet Explorer Browsers
    try{
        ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
        try{
            ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (e){
            // Something went wrong
            alert("Your browser broke!");
            return false;
        }
    }
}
// Create a function that will receive data sent from the server
ajaxRequest.onreadystatechange = function(){
    if(ajaxRequest.readyState == 4){
var result = ajaxRequest.responseText;      
    }
}
ajaxRequest.open("GET", "vartest.php", true);
document.getElementById('span').innerHTML = result;
ajaxRequest.send(null);

}

Answer 1

This is because Ajax is asynchronous, and result isn't set yet when you do this (plus the var makes it local to the function anyway, you'd have to remove that).

The best thing to do would be to move the innerHTML line into the readystatechange callback.

ajaxRequest.onreadystatechange = function(){
if(ajaxRequest.readyState == 4){
   document.getElementById('span').innerHTML = ajaxRequest.responseText;;      
}

Answer 2

ajaxRequest.onreadystatechange = function(){
    if(ajaxRequest.readyState == 4){
      result = ajaxRequest.responseText;        
    }
}
ajaxRequest.open("GET", "vartest.php", true);
document.getElementById('span').innerHTML = result;
ajaxRequest.send(null);
}

Answer 3

<script language="javascript" type="text/javascript">

//this is in the global scope
//so it's available anywhere

**var result;**

function ajaxFunction(){

    var path = 'http://localhost/php/';
    var fileName = 'yourCode.php';


    var ajaxRequest;  // The variable that makes Ajax possible!

    try{
        // Opera 8.0+, Firefox, Safari
        ajaxRequest = new XMLHttpRequest();
    } catch (e){
        // Internet Explorer Browsers
        try{
            ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try{
                ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e){
                // Something went wrong
                alert("Your browser broke!");
                return false;
            }
        }
    }
    // Create a function that will receive data sent from the server
    ajaxRequest.onreadystatechange = function(){
        if(ajaxRequest.readyState == 4){
                       **result = ajaxRequest.responseText;**
        }
    }


    ajaxRequest.open("GET", path+fileName, true);
    ajaxRequest.send(null); 
}

</script>