JS - Can not assign response from AJAX as custom variable

Question

I have this code:

var reg_email = document.getElementById("reg_email").value;
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        var response_email_check = xmlhttp.responseText;
    }
};
xmlhttp.open("GET", "./lib/checkemail.php?str=" + reg_email, true);
xmlhttp.send();

And I need response in variable, because I need to work with it later. If I run this it won´t even create variable "response_email_check". I am begginner with AJAX/JS, what am I doing wrong?

How do you know the variable is not created? You are nor even trying to access it. I guess you need to have a look at: http://stackoverflow.com/questions/23667086/why-is-my-variable-unaltered-after-i-modify-it-inside-of-a-function-asynchron — Felix Kling, Dec 26 '15 at 23:15
[How do I return the response from an asynchronous call?](http://stackoverflow.com/q/14220321/1529630) — Oriol, Dec 26 '15 at 23:30
@FelixKling I did not write rest of all the code. And console of chrome say that as well. — Slouchy, Dec 26 '15 at 23:37

gyosifov · Accepted Answer · 2015-12-26T23:36:37.070

In order to access the variable outside of the scope of the if statement (anything between if(...) { here } ), you would have to declare it beforehand. But since you are going to be assigning its value only in the event of ajax success, than I suggest passing it to a function that knows how to handle it. Something like this:

var reg_email = document.getElementById("reg_email").value;

var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        var response_email_check = xmlhttp.responseText;

        onCheckEmail(response_email_check);
    }
};
xmlhttp.open("GET", "./lib/checkemail.php?str=" + reg_email, true);
xmlhttp.send();

And you have to define the function onCheckEmail

function onCheckEmail(response_email_check){
    alert(response_email_check);
}

If the alert is not shown, then check to see if the ajax has been successful. You can do this by adding an else to your if statement:

    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        var response_email_check = xmlhttp.responseText;

        onCheckEmail(response_email_check);
    }else {
        alert("A server error occurred!");
    }

I usually have a seperate class that handles requests and on the post and get methods i have a parameter `callbac` which determins what to do with the data as soon as it has arrived! — Niklas Vest, Dec 26 '15 at 23:36
Wow good idea to pass it to the function directly, I will try and let you know, thanks! — Slouchy, Dec 26 '15 at 23:37
@Slouchy you can use it on the spot, but a function adds more flexibility to your code, and you may need to reuse the function keeping in lines with the DRY principle. — gyosifov, Dec 26 '15 at 23:39

JS - Can not assign response from AJAX as custom variable

1 Answers1