---
title: "How to fetch information from an XML file with AJAX?"  
description: "How to fetch information from an XML file with AJAX?"  
author: "Ethan Karla"  
published: 2021-08-19  
canonical: https://answers.mindstick.com/qa/93906/how-to-fetch-information-from-an-xml-file-with-ajax  
category: "programming"  
tags: ["asp.net", "jsp and servlets", "java programming", "php programming", "php"]  
reading_time: 4 minutes  

---

# How to fetch information from an XML file with AJAX?

How to [fetch](https://www.mindstick.com/articles/1364/cursor-in-sql) information from an [XML](https://www.mindstick.com/articles/178/xml-control-in-asp-dot-net) [file](https://www.mindstick.com/articles/59/encrypting-and-decrypting-files-using-c-sharp) with [AJAX](https://www.mindstick.com/articles/257/ajax-toolkit-calendarextender-control-in-asp-dot-net)?

## Answers

### Answer by Ravi Vishwakarma

## Example

```
<!doctype html>
<html lang='en'>
<head>
    <!-- Required meta tags -->
    <meta charset='utf-8'>
    <meta name='viewport' content='width=device-width, initial-scale=1'>
    <!-- Bootstrap CSS -->
    <link href='https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css' rel='stylesheet' integrity='sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC' crossorigin='anonymous'>
    <title>Ajax Example</title>
</head>
<body>
    <div class='container mt-3'>
        <h1 class='text-center'>Ajax Example </h1>
        <button type='button' onclick='loadResponseXML()' class='btn btn-primary my-3'>Click me for see the details of selected xml file</button>
        <h3 class='text-danger '>See details of of page</h3>
        <p  class='text-primary'>Whole information of xml file <span id='details' class='text-muted'></span></p>
        <h2>Book table here !!!</h2>
        <table id='loadDataInTable' class='table table-striped table-hover'></table>
    </div>
    <script>
        function loadResponseXML() {
            // creating instance of XMLHttpRequest()
            var xhttp = new XMLHttpRequest();
            xhttp.onreadystatechange = function () {
                if (this.readyState == 4 && this.status == 200) {
                    document.getElementById('details').innerHTML = xhttp.getAllResponseHeaders();
                    // call responseXML
                    var xmlDoc = xhttp.responseXML;
                    var x = xmlDoc.getElementsByTagName('BOOK');
                    let table='<thead class=\'thead-dark\'><tr><th> # </th><th>TITLE of Books</th><th>PRICE</th></tr></thead>';
                    for (let i = 0; i <x.length; i++) {
                        table += '<tr><td> '+(i+1)+' </td><td>' +
                        x[i].getElementsByTagName('TITLE')[0].childNodes[0].nodeValue +
                        '</td><td>' +
                        x[i].getElementsByTagName('PRICE')[0].childNodes[0].nodeValue +
                        '</td></tr>';
                    }
                    document.getElementById('loadDataInTable').innerHTML = table;
                }
            };
            xhttp.open('GET', 'xmlfile.xml', true);
            xhttp.send();
        }
     </script>
    <script src='https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js' integrity='sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM' crossorigin='anonymous'></script>
</body>
</html>
```

## xmlfile.xml

```
<?xml version='1.0' encoding='UTF-8'?>
<CATALOG>
   <BOOK>
      <AUTHOR>Gambardella, Matthew</AUTHOR>
      <TITLE>XML Developer's Guide</TITLE>
      <genre>Computer</genre>
      <PRICE>44.95</PRICE>
      <PUBLISH_DATE>2000-10-01</PUBLISH_DATE>
      <DESCRIPTION>An in-depth look at creating applications
      with XML.</DESCRIPTION>
   </BOOK>
   <BOOK>
      <AUTHOR>Ralls, Kim</AUTHOR>
      <TITLE>Midnight Rain</TITLE>
      <genre>Fantasy</genre>
      <PRICE>5.95</PRICE>
      <PUBLISH_DATE>2000-12-16</PUBLISH_DATE>
      <DESCRIPTION>A former architect battles corporate zombies,
      an evil sorceress, and her own childhood to become queen
      of the world.</DESCRIPTION>
   </BOOK>
   <BOOK>
      <AUTHOR>Corets, Eva</AUTHOR>
      <TITLE>Maeve Ascendant</TITLE>
      <genre>Fantasy</genre>
      <PRICE>5.95</PRICE>
      <PUBLISH_DATE>2000-11-17</PUBLISH_DATE>
      <DESCRIPTION>After the collapse of a nanotechnology
      society in England, the young survivors lay the
      foundation for a new society.</DESCRIPTION>
   </BOOK>
   <BOOK>
      <AUTHOR>Corets, Eva</AUTHOR>
      <TITLE>Oberon's Legacy</TITLE>
      <genre>Fantasy</genre>
      <PRICE>5.95</PRICE>
      <PUBLISH_DATE>2001-03-10</PUBLISH_DATE>
      <DESCRIPTION>In post-apocalypse England, the mysterious
      agent known only as Oberon helps to create a new life
      for the inhabitants of London. Sequel to Maeve
      Ascendant.</DESCRIPTION>
   </BOOK>
   <BOOK>
      <AUTHOR>Corets, Eva</AUTHOR>
      <TITLE>The Sundered Grail</TITLE>
      <genre>Fantasy</genre>
      <PRICE>5.95</PRICE>
      <PUBLISH_DATE>2001-09-10</PUBLISH_DATE>
      <DESCRIPTION>The two daughters of Maeve, half-sisters,
      battle one another for control of England. Sequel to
      Oberon's Legacy.</DESCRIPTION>
   </BOOK>
</CATALOG>
```

## Output

![How to fetch information from an XML file with AJAX?](https://answers.mindstick.com/questionanswer/436ff3ee-5525-4090-83dd-ba306641e52b/images/b4460921-290a-4913-aeb6-cae0b030ee18.png) **\**


---

Original Source: https://answers.mindstick.com/qa/93906/how-to-fetch-information-from-an-xml-file-with-ajax

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.
