Ajax Server Response, TutorialsPoint, W3Schools Ajax Server Response

Ajax Server Response

To get the response from a server, use the responseText or responseXML property of the XMLHttpRequest object.

Server Response Properties

Property	Description
responseText	get the response data as a string.
responseXML	get the response data as XML data.

responseText Property

If the response from the server is not XML, use the responseText property.

The responseText property returns the response as a string, and you can use it accordingly :

Syntax :

document.getElementById("sample_name").innerHTML = xhttp.responseText;

responseXML Property

If the response from the server is XML, and you want to parse it as an XML object, use the responseXML property.

File Name : ftl_sites.xml

<CATALOG>
<CD>
<TITLE>Free Time Learning</TITLE>
<FTLSITES>www.freetimelearning.com</FTLSITES>
<COUNTRY>INDIA</COUNTRY>
<COMPANY>F T L</COMPANY>
<YEAR>2017</YEAR>
</CD>
<CD>
<TITLE>Free Time Learn</TITLE>
<FTLSITES>www.freetimelearn.com</FTLSITES>
<COUNTRY>INDIA</COUNTRY>
<COMPANY>FTL</COMPANY>
<YEAR>2016</YEAR>
</CD>
<CD>
<TITLE>FreeTimeLearning</TITLE>
<FTLSITES>www.freetimelearning.xyz</FTLSITES>
<COUNTRY>INDIA</COUNTRY>
<COMPANY>FTL</COMPANY>
<YEAR>2017</YEAR>
</CD>
<CD>
<TITLE>FreeTimeLearn</TITLE>
<FTLSITES>www.freetimelearn.xyz</FTLSITES>
<COUNTRY>INDIA</COUNTRY>
<COMPANY>FTL</COMPANY>
<YEAR>2016</YEAR>
</CD>
</CATALOG>

File Name : index.html

<!DOCTYPE html>
<html>
<body>

<h3>responseXML Property</h3>

<p id="websites"></p>
 
<script>
var xhttp, xmlDoc, txt, x, i;
xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
  xmlDoc = this.responseXML;
  txt = "";
  x = xmlDoc.getElementsByTagName("FTLSITES");
  for (i = 0; i < x.length; i++) {
    txt = txt + x[i].childNodes[0].nodeValue + "<br>";
  }
  document.getElementById("websites").innerHTML = txt;
  }
};
xhttp.open("GET", "ftl_sites.xml", true);
xhttp.send();
</script>

</body>
</html>

Output :

Server Response Methods

Method	Description
getResponseHeader()	Returns specific header information from the server resource.
getAllResponseHeaders()	Returns all the header information from the server resource.

getResponseHeader()

The getResponseHeader() method returns specific header information from the server response.

Syntax :

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    document.getElementById("sample_text").innerHTML =
    this.getResponseHeader("Last-Modified");
  }
};
xhttp.open("GET", "dummy_text.txt", true);
xhttp.send();

getAllResponseHeaders()

The getAllResponseHeaders() method returns all header information from the server response.

Syntax :

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    document.getElementById("sample_text").innerHTML =
    this.getAllResponseHeaders();
  }
};
xhttp.open("GET", "dummy_text.txt", true);
xhttp.send();

Ajax Tutorial