Function returns undefined in Javascript

Question

Can not figure it out how to return value (string) from this function:

function loadPage(url) {
    var xhttp = new XMLHttpRequest();
    xhttp.open("GET", url, true);
    xhttp.send();

    xhttp.onreadystatechange = function() {
        if (xhttp.readyState == 4 && xhttp.status == 200) {
            //var html = xhttp.responseText
            var html = document.documentElement.outerHTML;
            return html
        }
    }
}

console.log(loadPage("http://stops.lt/vilnius/#trol/2/a-b"))

When I use console.log(html) inside xhttp.onreadystatechange it prints correct results, but I don't understand how to return loadPage(url). Tried both return xhttp.onreadystatechange and return xhttp.onreadystatechange() and none of these works.

async programming 101: http://stackoverflow.com/a/14220323/6567275 please read at least the ajax-part — Thomas, Jul 16 '16 at 15:45
Thanks for the link. I'm very new to Javascript. This is part of my first script ever written in js. — Gabrielius B., Jul 16 '16 at 16:14

score 2 · Accepted Answer · answered Jul 16 '16 at 15:42

Fuction loadPage is async, you need to use callback function(or Promise):

function loadPage(url, cb) {
    var xhttp = new XMLHttpRequest();
    xhttp.open("GET", url, true);
    xhttp.send();

    xhttp.onreadystatechange = function() {
        if (xhttp.readyState == 4 && xhttp.status == 200) {
            //var html = xhttp.responseText
            var html = document.documentElement.outerHTML;
            cb(html);
        }
    }
}
loadPage("http://stops.lt/vilnius/#trol/2/a-b", function(html){
    console.log(html);
});

Promises aren't supported very well (e.g. IE11), just use callbacks. — Aloso, Jul 16 '16 at 15:47

Function returns undefined in Javascript

1 Answers1