Flex で DataGrid に XML データをロードするには

単純に Web 上にある XML データをロードしたい場合は、 mx:HTTPService と mx:DeataGrid の dataProvider 属性を使って以下のように簡単にできる。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
  creationComplete="xmldata.send()" layout="absolute">

  <mx:HTTPService
    id="xmldata"
    url="http://blog.enjoitech.jp/upload/33_datagrid.xml"
    useProxy="false"/>

  <mx:Panel title="xml data">
    <mx:DataGrid id="dgUser" dataProvider="{xmldata.lastResult.users.user}">
      <mx:columns>
        <mx:DataGridColumn headerText="Name" dataField="name" />
        <mx:DataGridColumn headerText="Gender" dataField="gender" />
      </mx:columns>
    </mx:DataGrid>
  </mx:Panel>
    
</mx:Application>

もし POST データを渡して動的に変化する値を取得するには。

まず mx:HTTPService に mx:request ノードを追加して、 request データを送信するように変更すればいい。
また、以下のようにすると post データのレスポンスを確認してから xml データをロードする事もできる。
まず、 HTTPService に result 属性を追加して、レスポンス時のイベントハンドラーを指定する。

  <mx:HTTPService
    result="onXmlHttpResponse(event);"
    id="xmldata"
    url="http://blog.enjoitech.jp/upload/33_datagrid.xml"
    useProxy="false"/>

次にこのイベントハンドラーを実装する。

  <mx:ScriptHgt;
    <![CDATA[
      public function onXmlHttpResponse(event:ResultEvent):void
      {
        var source:ArrayCollection = event.result.users.user as ArrayCollection;
        dgUser.dataProvider = source;
      }
    ]]Hgt;
  </mx:ScriptHgt;

そんな感じ。
にしても Flex は情報少ないな。
一部のマニアがどかっと公開してくれてるけど。

コメント