Question

I am not sure if this is possible, I am working on a website that I do not have access to any kind of MYSQL or database. Nor any PHP. Cheap Client

Regardless I have 3 XML files with different parts of data, I have placed a “key” that matches each other. I believe a simple IF statement will do the matching.

However what is the best way to call 3 XML files and pull data out of all of them, and combine them into a loop.

Here is the code that works to pull one of them:

 $.ajax({
  type: "GET",
  url: "xml/classes.xml",
  dataType: "XML",
  beforeSend: function(){
    $('#classContainer').append("<p>Loading</p>");},
  success: function(xml) {
    $(xml).find('monday').each(function(){

            var $classdate = $(this); 
            var title = $classdate.find("class").attr('title');

            var level = $classdate.find("class").attr('classLevel');
                var time = $classdate.find("time").text();
                var duration = $classdate.find("time").attr("duration");
                var hourofday = $classdate.find("time").attr("hourofday");
                var location = $classdate.find("location").text();



            var Monhtml = '<div class="classBlock">';

            Monhtml += '<p class="title">' + title + '<span class="loadingPic" alt="Loading" /> ' + ' </p>';
                Monhtml += '<p class="infoBar"> <strong>Time:</strong>' + time + '<span class="hour">'+ hourofday +'</span><br>'+'<strong>Duration:</strong>' + duration +' Minutes <br>' + '<strong>Location:</strong>' + location + '<br><strong>Instructor:</strong> </p>';
                Monhtml += '<p class="description">  <span class="level">' +  level  + '</span></p>' ;

            Monhtml += '</div>';


            $('#classContainer').append($(Monhtml));
        });
        }
    }); 

I would like to create a variable to be placed in “monHTML” I would have a set of variables from 3 XML documents all merged into the “monHTML” var.

Any Ideas”?

Answer 1

Since you can’t merge the files on the server you will need to perform 3 independent ajax requests. The difficulty consists into synchronising the 3 requests. They can be performed synchronously but this will definitely hurt the performance and could cause timeouts. A better way is be to send the 3 requests asynchronously and invoke a callback once the 3 requests finish:

var addreses = ['xml/file1.xml', 'xml/file2.xml', 'xml/file3.xml'];

var ajaxQueue = {
    files         : [],
    checkFinished : function() {
        if (this.files.length == addresses.length) {
            // You can work with the 3 xml files here...
            // this.files will be an array of elements that contain
            // url and xml parameters. Check the url parameter to identify the 
            // corresponding xml. 
            // Remark: as the order in which the requests finish can vary, the array
            // will not be sorted.
        }
    };
};

$(addreses).each(function(index, address) {
    $.ajax({
        url      : address,
        dataType : 'xml',
        success  : function(data) {
            ajaxQueue.files.push({ url: address, xml: data });
            ajaxQueue.checkFinished();
        }
    });
});