SitePoint Sponsor

User Tag List

Results 1 to 11 of 11
  1. #1
    SitePoint Member
    Join Date
    Mar 2007
    Posts
    8
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    JS + XML relationships

    Hey all,

    I'm having a problem with some AJAX that I need to get working for a site.

    I have the following XML:
    Code:
    <class>
    	<number>0</number>
    	<name>English</name>
    	<tasks>
    		<task>Essay<date>0</date></task>
    	</tasks>
    </class>
    And I need to relate the task (in this case, "Essay") to the number (0).

    I current have something running here, but its not acting how I want it to. The tasks should go back to their respective subjects, but I'm not sure how to relate the child back to its parent, and then to its sibling. I'm not sure if this makes any sense, but if you check out the website, hopefully you can see what I'm talking about.

  2. #2
    SitePoint Evangelist vikrantkorde's Avatar
    Join Date
    Jun 2004
    Location
    Mumbai, India
    Posts
    541
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Not sure what exactly you are asking for.
    but i guess it has something to do with the XML parsing.
    1) traverse to the level of task element
    2) get the value of the number element i.e. ../../number
    Vikrant Korde
    S Y S T I M E, Mhape,
    Mumbai, Maharashtra, India.

  3. #3
    SitePoint Guru SSJ's Avatar
    Join Date
    Jan 2007
    Posts
    828
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Not sure what exactly you are asking for.
    but i guess it has something to do with the XML parsing.
    Is it so???

  4. #4
    SitePoint Member
    Join Date
    Mar 2007
    Posts
    8
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here is my javascript if it helps you interpret what I'm doing.

    Code:
    function makeRequest(url)
    {
                if(window.XMLHttpRequest)
                {
                            request = new XMLHttpRequest();
                }
                else if(window.ActiveXObject)
                {
                            request = new ActiveXObject("MSXML2.XMLHTTP");
                }
                sendRequest(url);                                 
    }
    function sendRequest(url)
    {
                request.onreadystatechange = onResponse;
                request.open("GET", url, true);
                request.send(null);
    }
    function checkReadyState(obj)
    {
            if(obj.readyState == 0) { document.getElementById('c0').innerHTML = "Sending Request..."; }
              if(obj.readyState == 1) { document.getElementById('c0').innerHTML = "Loading Response..."; }
              if(obj.readyState == 2) { document.getElementById('c0').innerHTML = "Response Loaded..."; }
              if(obj.readyState == 3) { document.getElementById('c0').innerHTML = "Response Ready..."; }
            if(obj.readyState == 4)
                {
                            if(obj.status == 200)
                            {
                                        return true;
                            }
                            else if(obj.status == 404)
                            {
                                        // Add a custom message or redirect the user to another page
                                        document.getElementById('c0').innerHTML = "File not found";
                            }
                            else
                            {
                                        document.getElementById('c0').innerHTML = "There was a problem retrieving the XML.";
                            }
                }
    }
    function onResponse()
    {
          if(checkReadyState(request))
        {
    		var response = request.responseXML.documentElement;
    		var class = response.getElementsByTagName('class');
    
    		for(x=0;x<class.length;x++)
    		{
    			var name = response.getElementsByTagName('name')[x].firstChild.data;
    			var j = "c" + x;
    			document.getElementById(j).innerHTML = name;
    		}
    		
    		var ts = response.getElementsByTagName('task');
    		for(x=0;x<ts.length;x++)
    		{
    			var task = response.getElementsByTagName('task')[x].firstChild.data;
    			var date = response.getElementsByTagName('date')[x].firstChild.data;
    			var k = "t" + date;
    			document.getElementById(k).innerHTML += "<li class='list'><span class='class" + x + "'>" +  task + "</span></li>";
    		}
    			document.getElementById(k).innerHTML += "</ol>";
    	}
    
    }
    The problem comes at
    Code:
    document.getElementById(k).innerHTML += "<li class='list'><span class='class" + x + "'>" +  task + "</span></li>";
    where I need to replace x with the value of 'number' from my XML document.

    I'm hoping this helps.

  5. #5
    SitePoint Guru SSJ's Avatar
    Join Date
    Jan 2007
    Posts
    828
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

  6. #6
    SitePoint Member
    Join Date
    Mar 2007
    Posts
    8
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm sorry, but I cannot interpret any of that. Perhaps if you take a look at this you will understand it better.

    I've already tried to look it up myself on w3schools and other websites, but I simply cannot understand what they're talking about.

  7. #7
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Nelson BC
    Posts
    2,310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Does this help?
    Code:
    // get a list of all "class" nodes in the response
    var classes = response.getElementsByTagName("class");
    
    // loop through them
    for (var i=0; i < classes.length; i++) {
    	// create a reference to the current "class" node
    	var currentClass = classes[i];
    	
    	// get a list of all "task" nodes that are in the current class
    	
    	var tasks = currentClass.getElementsByTagName("task");
    	
    	// loop through them
    	for (var j=0; j < tasks.length; j++) {
    		// create a ref to the current task
    		var currentTask = tasks[j];
    		
    		// do something with the objects we have created
    		alert("current class name/number " + currentClass.getElementsByTagName("name").firstChild.data + " / " + currentClass.getElementsByTagName("number").firstChild.data);
    		alert("current task name/date " + currentTask.firstChild.data + " / " + currentTask.getElementsByTagName("date").firstChild.data);
    	}
    }

  8. #8
    SitePoint Member
    Join Date
    Mar 2007
    Posts
    8
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Going through it, it seems to be exactly what I need, but I keep getting "firstChild has no properties" errors in Firefox (the site doesn't work at all in ).

    I'll work on this some more when I get home to see if I can figure it out. Thanks.

  9. #9
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Nelson BC
    Posts
    2,310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    mm yeah, I wasnt sure about that part. You might have to replace all the .firstChild.data bits with something more appropriate....in IE I think .text would work but not sure about FF.

  10. #10
    SitePoint Member
    Join Date
    Mar 2007
    Posts
    8
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    .text isn't working in either of them. I'm not sure why .data isn't working, since I used the same thing earlier. Could you explain?

    When I try to alert various parts of the code I'm getting what seems like header tags. Might that be the problem?

  11. #11
    SitePoint Member
    Join Date
    Mar 2007
    Posts
    8
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sorry to bump my own thread, but I'm still completely lost here. If someone could give me a hand and tell me why jim's code isn't working I would really appreciate it!


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
  •