SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Member
    Join Date
    Nov 2009
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    JS function to import XML data

    hi,

    I have a js function to display data from a xml file. However, the function does not work properly if the XML file has more than 517 entries.

    Any idea what could be wrong (see code below)

    //dataset load function
    $(document).ready(function()
    {
    //get params
    var params = extractUrlParams();
    var dataset = params["dataset"];
    var folder = params["month"];

    //load XML
    docXml = new ActiveXObject("Microsoft.XMLDOM");
    docXml.load('xml/archive.xml');
    //get folder and month data
    var folderNode = docXml.getElementsByTagName('folder');
    var monthNode = docXml.getElementsByTagName('month');

    //if first visit, get latest date
    if(!folder)
    folder = folderNode[folderNode.length-1].firstChild.nodeValue;
    //else it is an archive
    else
    {
    folder = unescape(folder);
    //update links to keep the selected date
    $("ul#menu > li > a").each(function(i)
    {
    var href = $(this).attr("href");
    $(this).attr("href", href+'&month='+folder);
    });
    }

    //retreive proper date name
    for(i=0;i<folderNode.length;i++)
    {
    if(folderNode[i].firstChild.nodeValue == folder)
    var folderDate = monthNode[i].firstChild.nodeValue;
    }
    //add date to title
    $("#date").text(folderDate);

    if(!dataset)//home page
    {
    document.title = "Amey Rail Management Pack";
    $("#contentH1 > h1").text("Amey Rail Management Pack");
    }
    else//content page
    {
    dataset = unescape(dataset);
    //hide current link
    $("ul#menu > li#"+dataset).hide();

    //set titles
    document.title = "Amey Rail Management Pack | "+dataset;
    $("#contentH1 > h1").text(dataset);

    //loadContent
    loadData(dataset,folder);
    }


    //populate archive list
    for(i=0;i<folderNode.length;i++)
    {
    var opt = jQuery('<option value="'+folderNode[i].firstChild.nodeValue+'">'+monthNode[i].firstChild.nodeValue+'</option>');



    if(monthNode[i].firstChild.nodeValue == folderDate)
    {
    opt.attr("selected", true);
    }
    opt.appendTo("#archiveList");
    }
    $("#archiveDiv").addClass("right");

    //archive change handling
    $("#archiveList").change(function()
    {
    //get dataset
    var params = extractUrlParams();
    var dataset = params["dataset"];

    //change month value
    if(!dataset)
    window.location ='?month='+$(this).attr("value");
    else
    window.location ='?dataset='+dataset+'&month='+$(this).attr("value");
    });
    });

    //function to manage data display
    function loadData(dataset,folder)
    {
    docXml = new ActiveXObject("Microsoft.XMLDOM");
    docXml.load("xml/"+folder+"/"+dataset.split(' ').join('')+"Data.xml");

    var XMLdataSet = docXml.getElementsByTagName('testData');
    var table = jQuery("<table id='table'></table>");
    table.appendTo("#dataContainer");

    readNodes(XMLdataSet[0],1,1);
    }

    //readNodes
    function readNodes(dataSet,rowNum,dataNum) //recursive function to read the xml file
    {
    //if node has child
    if(dataSet.hasChildNodes())
    //call function on first child
    readNodes(dataSet.firstChild,rowNum,dataNum);

    //if node has no child
    else
    {
    //action
    if(dataSet.nodeValue)
    inputData(dataSet.nodeValue,rowNum,dataNum);
    else
    inputData(0,rowNum,dataNum);

    //if node has brother
    if(dataSet.parentNode.nextSibling) //call function on brother -- data level
    {
    dataNum++; //increment data number
    readNodes(dataSet.parentNode.nextSibling,rowNum,dataNum);
    }

    //else, if parent node has brother
    else if(dataSet.parentNode.parentNode.nextSibling) //call function on parent's brother -- row level
    {
    rowNum++; //increment row number
    dataNum = 1; //reset data number
    readNodes(dataSet.parentNode.parentNode.nextSibling,rowNum,dataNum);
    }
    }
    }

    var currentRowNum = 0;

    function inputData(value,rowNum,dataNum)
    {
    if(rowNum != currentRowNum)
    {
    var row = jQuery("<tr id='row"+rowNum+"'></tr>");
    row.appendTo("#table");
    currentRowNum = rowNum;
    }

    if(rowNum == 1)
    var column = jQuery("<th>"+value+"</th>");
    else
    var column = jQuery("<td>"+value+"</td>");

    column.appendTo("#row"+rowNum);
    }

    function extractUrlParams()
    {
    var t = location.search.substring(1).split('&');
    var f = -1;
    if(t)
    {
    f = [];
    for (var i=0; i<t.length; i++)
    {
    var x = t[ i ].split('=');
    f[x[0]]=x[1];
    }
    }
    return f;
    }

  2. #2
    SitePoint Evangelist TommiChi's Avatar
    Join Date
    Oct 2008
    Posts
    440
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Have you check the XML file to see if it is well formed? You could also try a regular non jQuery HTTPrequest to see if you can successfully extract your data that way:
    try {
    xmlFile = new XMLHttpRequest();
    xmlFile.overrideMimeType("text/xml");
    xmlFile.open("GET", 'xmlfile.xml', true);
    }
    catch(err) {
    xmlFile = new ActiveXObject("Microsoft.XMLHTTP");
    xmlFile.open("GET", xmlfile.xml', true);
    xmlFile.setRequestHeader("Content-Type", "text/xml");
    }
    xmlFile.onreadystatechange = function() {
    if(xmlFile.readyState == 4) {
    ....
    }
    }
    xmlFile.send(null);

  3. #3
    SitePoint Member
    Join Date
    Nov 2009
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks TommiChi,

    I have checked that the XML file is well formed.

    Thanks for the code but I am not familiar with JS...how do I integrate your code into the main function?

  4. #4
    SitePoint Evangelist TommiChi's Avatar
    Join Date
    Oct 2008
    Posts
    440
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Alright, I wrote below some sample code that could help you out. Essentially I am outputting the content of the XML file to a textarea. All you need to do is replace the XML file I specified in the "xmlFile.open" statements with your own:
    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>My Web Page</title>
    </head>
    <body>
    <textarea cols="100" rows="20" id="mytextarea"></textarea>
    <script>
    try {
    xmlFile = new XMLHttpRequest();
    xmlFile.overrideMimeType("text/xml");
    xmlFile.open("GET", 'xml/myfile.xml', true);
    }
    catch(err) {
    xmlFile = new ActiveXObject("Microsoft.XMLHTTP");
    xmlFile.open("GET", 'xml/myfile.xml', true);
    xmlFile.setRequestHeader("Content-Type", "text/xml");
    }
    xmlFile.onreadystatechange = function() {
    if(xmlFile.readyState == 4) {
    var theResponse = xmlFile.responseText;
    document.getElementById('mytextarea').innerHTML = theResponse;
    }
    }
    xmlFile.send(null);
    </script>
    </body>
    </html>

  5. #5
    SitePoint Member
    Join Date
    Nov 2009
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks...it is working fine now....

    I am also trying to open an excel file using the <a href="path/filename.xls"> command in my htm file

    however i would like to change the value of the path depending on the value of a variable in the js function..how do i do this?

  6. #6
    SitePoint Evangelist TommiChi's Avatar
    Join Date
    Oct 2008
    Posts
    440
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You have to pass the value as a parameter of the function. Therefore, you would have a function looking like "function myFunction(MYVAR) { myobject.path = MYVAR; }", so that when you call it you would do something like "myFunction('myfile.xls');"


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •