Displaying

In the previous page you you learned about the ActionScript that helps you to display the XML data. On this page I will expand upon how Flash goes through your XML to display the right data at the right place.

How Data is Arranged
Let's go back to our XML file:

<?xml version="1.0"?>

<inventors>

   <person>

      <name>Thomas Edison</name>

      <comment>Inventor of cool stuff.</comment>

   </person>

   <person>

      <name>Doug Engelbart</name>

      <comment>Invented the Mouse</comment>

   </person>

</inventors>

If you are familiar with loading data from, for example, a text file, you have to make sure that the variable names in your text file are the same as the variable names you are using in your Flash file.

Getting XML data in Flash doesn't adhere to tracking and passing variables. Instead of trying to specify a variable in Flash to find the data in an XML file, you search based on the location of the data in an XML file.

Think of the XML file as a movie clip containing nested movie clips. Each child-node is another movie clip nested inside the main movie clip. The final attribute is similar to a variable declared inside a movie clip buried inside several other layers of movie clips. In order to access the data - the attribute - you need to travel through all of the nested movie clips in order to reach the movie clip containing the variable.

In the Flash-view, you can look at the XML data as:

_root.inventors.person.name.text = "Thomas Edison";

The above is used just an example. It is in no way accurate or representative of how the data in XML is really stored!

In XML all of the data, you can also look at the data in levels similar to Flash:

Ok, I am sure you are interested in wondering what in the world the AS code for the comments and inventor variables accomplish. So here is the code for the inventor variable:

this.firstChild.childNodes[0].childNodes[0].firstChild.nodeValue;

Imagine the above line of code as navigating through your movie clips. You start at the top level of your XML file - the root area - symbolized by the use of the this keyword.

You progress to level 2 by using the firstChild term. firstChild contains two nodes for person. How do you determine which node to navigate through? You have hit the fork in the road!

To pick the right node from a collection of nodes (such as what we have here with two instances of the person node), you assign each node a number starting with zero.

this.firstChild.childNodes[0].childNodes[0].firstChild.nodeValue;

The above portion of the larger code takes you to the first node (signified by the 0)contained under the root node - inventor. That first node refers to Thomas Edison in our example. Of course, you have more nodes to go through before reaching our attributes - the text that describes our inventor.

So, we move on using childNode. Again, we find ourselves with two nodes - name and comment. Using the same numbering convention, you will use a 0 or 1 to signify which node you want to travel through.

Since we are interested in the name of the inventor, we use a 0 because that is the first node:

this.firstChild.childNodes[0].childNodes[0].firstChild.nodeValue;

You are not done yet though! You still have not retrieved the data (the attribute) from this node. What you have done is crawled down the tree to the right branch containing what you are looking for. You haven't rolled up your sleeve and reached over the branch to get the data stuck on the branch.

You reach for the data by using the firstChild property. You grab the data by using the nodeValue property. In Flash MX 2004 and possibly MX, you do not need to use nodeValue to get at your data.

So that is how you end up with this code:

this.firstChild.childNodes[0].childNodes[0].firstChild.nodeValue;

If you are interested in retrieving the value from the comment node, you would follow a similar path? The only difference is that comment is not the first node contained in the parent node - person. Comment is the second node contained under person.

Your code will therefore look like the following for the comments variable:

this.firstChild.childNodes[0].childNodes[1].firstChild.nodeValue;

You don't change the number for the first childNode property because you are still talking about the first inventor. You are only jumping branches once you reach the person node.

If you notice, you will find that I have included another inventor in my XML file. All of this time you have been dealing with Einstein. Let's deal with Doug Engelbart instead. Your code for displaying the name for Engelbart would look like the following:

this.firstChild.childNodes[1].childNodes[0].firstChild.nodeValue;

Notice that I changed the 0 for the first child node to a 1 because Doug Engelbart is the second node contained in the main, root node called inventors. The number for the second child node (found in person) stays the same because name is still the first node contained in the person node. That makes sense, doesn't it?

Let's continue on to the next page!

---

page 4 of 5

---