標籤雲

搜尋此網誌

2009/12/02

Flex 筆記 - 讀取 XML 資料並做 filtering

之前花了很多時間在 Flex in a week 上面
現在把一些 MXML 的基礎整理一下放上來
也算是對於這段時間的學習做個交代(不然 Flex 4 都要出了說...)

<?xml version="1.0" encoding="utf-8"?>
<MX:APPLICATION creationComplete="init()" xmlns:mx="http://www.adobe.com/2006/mxml">
 <MX:SCRIPT>
   <![CDATA[
   import mx.collections.XMLListCollection;
   import mx.controls.Alert;
   import mx.rpc.events.FaultEvent;
   import mx.rpc.events.ResultEvent;
   
   [Bindable]
   private var myData1:XMLListCollection = new XMLListCollection();
   
   protected function init():void{
    httpSer1.send();
   }
   protected function httpSer1_faultHandler(event:FaultEvent):void{
    Alert.show(event.message.toString(),"錯誤訊息:");
   }
   protected function httpSer1_resultHandler(event:ResultEvent):void{
    var list:XMLList = event.result.dataItem;
    myData1.source = list;
   }
   protected function searchBtn_clickHandler(event:MouseEvent):void{
    if (searchText.text != "") myData1.filterFunction = searchMyData;
    else myData1.filterFunction = null;  
    myData1.refresh();
   }
   protected function searchMyData(item:XML):Boolean{
    var searchResult:XMLList = item.(firstname == searchText.text || lastname == searchText.text);
    if (searchResult.length() > 0) return true;
    else return false;
   }
  ]]>
</MX:SCRIPT>
 <MX:HTTPSERVICE id=httpSer1 result="httpSer1_resultHandler(event)" fault="httpSer1_faultHandler(event)" resultFormat="e4x" url="assets/myData.xml" />
 <MX:HBOX>
  <MX:TEXTINPUT id=searchText />
  <MX:BUTTON id=searchBtn click="searchBtn_clickHandler(event)" label="Search" />
 </MX:HBOX>
 <MX:DATAGRID id=myDataGrid dataProvider="{myData1}">
  <MX:COLUMNS>
   <MX:DATAGRIDCOLUMN headerText="First" dataField="firstname" />
   <MX:DATAGRIDCOLUMN headerText="Last" dataField="lastname" />
  </MX:COLUMNS>
 </MX:DATAGRID>
</MX:APPLICATION>
重點說明:
1. 利用 HTTPService 標籤讀取 xml 資料,resultFormat 設為 e4x
2. 將 result 放入 XMLListCollection 實體的 source 中,因為 Collection 這種類別可以進行篩選
3. 篩選功能利用的是 XMLListCollection 的 filterFunction 屬性指定實際進行篩選的 function,再利用 XMLListCollection 的 refresh() 方法更新
4. filterFunction 必須要將合乎篩選規則的資料 回傳 true

沒有留言: