Loading name/value pairs using the mx:HTTPService tag

Semi-related to my previous post, I was playing around and figured out a way (probably not the best method) for loading a page of remote name/value pairs and putting them in a DataGrid using the HTTPService tag.

Full code after the jump

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal" verticalAlign="middle" backgroundColor="white" creationComplete="httpParams.send()">

    <mx:HTTPService resultFormat="flashvars" url="{VARIABLES_URL}" id="httpParams" result="onResult(event)" />

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

            [Bindable]
            private var VARIABLES_URL:String = "http://www.flash-mx.com/mm/params.txt";

            [Bindable]
            private var paramColl:ArrayCollection = new ArrayCollection();

            private function onResult(evt:ResultEvent):void {
                var vars:Object = evt.result;
                var key:String;

                for (key in vars) {
                    paramColl.addItem({key:key, value:vars[key]});
                }
                params.visible = true;
            }
        ]]>
    </mx:Script>

    <mx:VBox>
        <mx:Label text="Parameters:" />
        <mx:DataGrid id="params" dataProvider="{paramColl}" rowCount="5" visible="false">
            <mx:columns>
                <mx:DataGridColumn dataField="key" headerText="Key" />
                <mx:DataGridColumn dataField="value" headerText="Value" />
            </mx:columns>
        </mx:DataGrid>
    </mx:VBox>

</mx:Application>

Again, I’m sure there is a nicer way of handling the ResultEvent and converting to a data provider, so you may want to play around with it a bit.

Of course, if you know the names of the parameters in the file that you’re loading, you could also just do something like this:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle" backgroundColor="white" creationComplete="httpService.send()">

    <mx:HTTPService id="httpService" resultFormat="flashvars" url="params.txt" />

    <mx:VBox>
        <mx:Label text="name: {httpService.lastResult.name}" />
        <mx:Label text="product: {httpService.lastResult.product}" />
        <mx:Label text="powermove: {httpService.lastResult.powermove}" />
        <mx:Label text="skill: {httpService.lastResult.skill}" />
    </mx:VBox>

</mx:Application>

Oh, and remember, since the params.txt file is being loaded at run-time and embedded during compile-time, the params.txt file needs to be relative to the SWF file and not the MXML file.