Thursday, June 30, 2011

XML in Flex: Part 4 - Using the XML loaded at runtime

In the previous tutorial we've learned how to load external XML data at runtime and today we will learn how to retreive the results.

Before we go further, let's take a look at one more property of HTTPService, which is called resultFormat. The possible values are: object, array, xml, e4x, flashvars, text. By default, all the data is received in Object format. Let's change that and use e4x instead.

<fx:Declarations>
<s:HTTPService id="myData" url="http://www.mysite.com/products.xml" result="handleResults(event)" resultFormat="e4x" />
</fx:Declarations>

There are 2 ways of getting the results and using them - we can do that by using the lastResult property of the HTTPService, or the result property of the event object that's passed as the parameter to our result event handler.

Now, the lastResult property of the HTTPService object is pretty easy to use, but sometimes not too practical.

We simply take the lastResult property when the results are available, and use them like we would use an object of the specified resultFormat type, which in our case is e4x. I will add a Label object and set its text value to the name of the first product in my XML list.

myLabel.text = myData.lastResult.product[0].name;

The whole code will look like this:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx"
   width="100" height="85"
   creationComplete="myData.send();">
   
<fx:Declarations>
<s:HTTPService id="myData" url="C:\Users\7 User\Documents\Kir\FlashDev\test_project_1\src\products.xml" result="handleResults(event)" resultFormat="e4x" />
</fx:Declarations>

<fx:Script>
<![CDATA[
import mx.rpc.events.ResultEvent;

private function handleResults(evt:ResultEvent):void {
myLabel.text = myData.lastResult.product[0].name;
}
]]>
</fx:Script>

<s:Label id="myLabel" />

</s:Application>

If I want to use the results property (which is the property of the event object), my event handler function would look like this:

private function handleResults(evt:ResultEvent):void {
myLabel.text = evt.result.product[0].name;
}

And the whole code would be:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx"
   width="100" height="85"
   creationComplete="myData.send();">
   
<fx:Declarations>
<s:HTTPService id="myData" url="C:\Users\7 User\Documents\Kir\FlashDev\test_project_1\src\products.xml" result="handleResults(event)" resultFormat="e4x" />
</fx:Declarations>

<fx:Script>
<![CDATA[
import mx.rpc.events.ResultEvent;

private function handleResults(evt:ResultEvent):void {
myLabel.text = evt.result.product[0].name;
}
]]>
</fx:Script>

<s:Label id="myLabel" />

</s:Application>

Thanks for reading!

Related:

XML in Flex: Part 1 - The fx:Model tag
XML in Flex: Part 2 - The fx:XML tag
XML in Flex: Part 3 - Loading XML at runtime
XML in Flex: Part 5 - Using XMLListCollection

No comments:

Post a Comment