How to fetch data from xml that on different domain using ajax

I have 3 file:
1- index.html on my server that made ajax call and fetch xml content.
2- openingHours.xml that hold the content (in the remote server).
3- xml.php the server file (in the remote server).


<!DOCTYPE html>
<head lang="en">
    <meta charset="UTF-8">

        var xmlHttp;
        var output;

        function fetch()
            xmlHttp = new XMLHttpRequest();
            xmlHttp.onreadystatechange = callback;

            //open connection
  "GET", "", true);

        function callback()
            if(xmlHttp.readyState == 4 && xmlHttp.status == 200)
                var holdOneTagName;
                //get all the node name bank
                var holdAllTheBanksNodes = xmlHttp.responseXML.documentElement.getElementsByTagName("BANK");
                //start create the table for all data
                output = "<table border='1'><tr><th>Bank name</th><th>morning</th><th>afternoon</th></tr>";
                output = output   "<tr>";
                for(var i=0 ; i<holdAllTheBanksNodes.length ; i  )
                    holdOneTagName = holdAllTheBanksNodes[i].getElementsByTagName("name");
                    output = output   "<td>"   holdOneTagName[0].firstChild.nodeValue   "</td>";

                    holdOneTagName = holdAllTheBanksNodes[i].getElementsByTagName("morning");
                    output = output   "<td>"   holdOneTagName[0].firstChild.nodeValue   "</td>";

                    holdOneTagName = holdAllTheBanksNodes[i].getElementsByTagName("afternoon");
                    output = output   "<td>"   holdOneTagName[0].firstChild.nodeValue   "</td>";

                    output = output   "</tr>";

                output = output   "</table>";

                document.getElementById('result').innerHTML = output;

    <title>Opening Hours</title>

<input type="button" value="fetch banks opening hours" onclick="fetch()">

<div id="result">





header("Access-Control-Allow-Origin: http://localhost:1337");
header('Content-type: application/xml');

The last option is to made the ajax call when the html and the xml is on the same server, then you only need to change in the html file:"GET", "openingHours.xml", true);

and you don’t need the php file.

fetch xml

This entry was posted in כללי and tagged , , . Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s