Using XML in Flex - Tutorial Part 1

My primary references for this tutorial are Programming ActionScript 3.0 Working With XML from Adobe and the XML class description in the Adobe® Flex™ 2 Language Reference

EXtensible Markup Language (XML) is often used to exchange data between web applications. Flex 2.0 has excellent and simple to use capabilities to process XML documents. This tutorial will give a brief introduction in how to use XML data in Flex 2.0.

ActionScript 3.0 has a built class called XML, that we can use to create an XML object and get data out of the XML document. This XML class is new for ActionScript 3.0 and follows a specification that makes it simpler to process an XML document.

Let's take a look an the XML class. Before we can use the methods defined by the XML class we must first create an object based on the XML class. If you scroll down to the Public Methods section of the XML class description you will see a method named XML. This method is used to create a new XML object.

Here is the XML method's description:

XML

()

constructor

public function XML(value:Object)

Creates a new XML object. You must use the constructor to create an XML object before you call any of the methods of the XML class.

Use the toXMLString() method to return a string representation of the XML object regardless of whether the XML object has simple content or complex content.

Parameters

value:Object — Any object that can be converted to XML with the top-level XML() function.

The word constructor after XML() signifies that this is the method of the XML class used to create an object. Inside the parenthesis you will see that this method requires us to provide an Object. The information inside the parenthesis is known as the method's parameter. The XML method has one parameter whose type is Object. Class (type) Object is the parent of all the ActionScript classes, so almost anything could be used as the argument to this XML method. The key is that the Object we provide for the parameter must be something that can be converted to a normal XML document.

Let's create a String variable that holds an XML document:

var xmlStr:String = "<order> <!--This is a comment. --> <?PROC_INSTR sample ?> <item id='1'> <menuName>burger</menuName> <price>3.95</price> </item> <item id='2'> <menuName>fries</menuName> <price>1.45</price> </item> </order>"

Since class String is a child of class Object we can use this String variable for the XML method's parameter:

var myXML:XML = new XML( xmlStr );

and once we've created the myXML object, we can use the public methods defined by the XML class to get data out of or put new elements into the XML document (represented by our xmlStr). Note per the documentation: "If the XML data in the string is not well formed (for example, if a closing tag is missing), you will see a run-time error."

If we know the names of the attributes or elements (nodes) in our XML document we can easily display the value of the element or attribute. For example our xmlStr has an <menuName> element. If we want to get the the value stored in this element we would use a notation similar to the dot notation for referring to a structure:

var nameStr:String = myXML.item[0].menuName ;

The above uses the myXML object, then goes to the first item element (the first element is at position 0), then to the menuName child element.

To display the value of an attribute, you use the @ symbol

var itemID:String = myXML.item[0].@id;

You can also use the value of an attribute to get a specific element:

var menuName:String = myXML.item.(@id==2).menuName;

Above will return fries since it is the menuName that is a child of the item with an id equal to 2.

We can use the appendChild method of the XML class to add an element to the end of our XML document.

myXML.appendChild(<item id='3'> <menuName>coke</menuName> <price>1.25</price> </item>);

To see a Flex 2.0 demo of the code we've discussed in this tutorial go here: /flex/xmltutorial/part1/xmltutorial.html. You can right click on the Flex 2.0 application to view the source.

In our next tutorial we will explore how to use XML data in a Flex application.