Empty response of XMLHttpRequest

Question

In my Java Web application I am calling ajax request as below.

<script type="text/javascript">
function selectTableHandler() {
    console.log("indise selectTableHandler");
    var xhttp = new XMLHttpRequest();

    var selectedTable = document.getElementById('selectTable').value;
    alert(selectedTable);
    xhttp.open("GET", "populateTableColumList.action?tablename="
            + selectedTable, true);
    xhttp.send();
    console.log(xhttp.responseText);
}
</script>

The Action is calling and returns status code 200 as below.

Remote Address:[::1]:8080
Request        URL:http://localhost:8080/ReportBuilder/populateTableColumList.action?tablename=films
Request Method:GET
Status Code:200 OK

But, it gives empty response of XMLHttpRequest. The line console.log(xhttp.responseText); prints nothing. Also, there is no error in console log.

Any suggestions would be appreciated.

Thanks

Answer 1

You need to add a callback function to get the result of the ajax request.

xhttp.onreadystatechange = function() {
  if (xhttp.readyState == 4 && xhttp.status == 200) {
    console.log(xhttp.responseText);
  }
}

Answer 2

Your ajax request is asynchronous. That means it returns the result some time LATER. You will need to install an event handler for onload or onreadystatechange to get the result.

There are plenty of Ajax tutorials on how to do this. Here are a couple useful references:

https://developer.mozilla.org/en-US/docs/AJAX/Getting_Started

https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest