flex中ComboBox对应的几种数据绑定

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="init()">
 <mx:Script>
  <![CDATA[
   import mx.collections.XMLListCollection;
   import mx.collections.ArrayCollection;
   /*
    *这个例子重点演示了常见的到ComboBox的几种绑定,分别是基于数组、基于XML的数据、基于mx:Model的绑定
    对于XMl的情况,通常我们要定位到children()对应的XMLList来绑定
    */
   [Bindable]
   private var listdata:ArrayCollection;
   [Bindable]
   private var xmldata:XMLListCollection;
   [Bindable]
   private var xmlnode:XMLListCollection;
   [Bindable]
   private var xmllist:XMLList;

   private function init():void
   {
    //基于数组定义的绑定
    var list:Array=[{label: '中国', value: 'CN'}, {label: '美国', value: 'usa'}, {label: '英国', value: 'uk'}];
       //基于xml属性定义的绑定
    this.listdata=new ArrayCollection(list);
    var xml:XML=<root>
     <item label="datagrid" value="1"/>
     <item label="combobox" value="2"/>
     <item label="List" value="3"/>
    </root>;
    //构造一个xml节点定义XMLListCollection
    xmldata=new XMLListCollection(new XMLList([xml]));
    var xml1:XML=<root>
     <item>
      <label>java</label>
      <value>a</value>
     </item>
     <item>
      <label>c#</label>
      <value>b</value>
     </item>
     <item>
      <label>delphi</label>
      <value>c</value>
     </item>
    </root>;
    xmlnode=new XMLListCollection(new XMLList([xml1]));
    //直接构造一个XMLList对象
    xmllist=new XMLList();
    xmllist+=<item><label>白色</label><value>white</value></item>;
    xmllist+=<item><label>黑色</label><value>black</value></item>
   }

   private function binddata():void
   {
    if(cbBindType.selectedItem.value=="xml1"){
     cbList.dataProvider=xmldata.children();
     cbList.labelField="@label";
     DataGridColumn(grid1.columns[0]).dataField="@label";
     DataGridColumn(grid1.columns[1]).dataField="@value";
    }
    else if(cbBindType.selectedItem.value=="xml2"){
     cbList.dataProvider=xmlnode.children();
     cbList.labelField="label";
     DataGridColumn(grid1.columns[0]).dataField="label";
     DataGridColumn(grid1.columns[1]).dataField="value";
    }
    else if(cbBindType.selectedItem.value=="xml3"){
     cbList.dataProvider=xmllist;
     cbList.labelField="label";
     DataGridColumn(grid1.columns[0]).dataField="label";
     DataGridColumn(grid1.columns[1]).dataField="value";
    }
    else{
     cbList.dataProvider=listdata;
     cbList.labelField="label";
     DataGridColumn(grid1.columns[0]).dataField="label";
     DataGridColumn(grid1.columns[1]).dataField="value";
    }
    grid1.dataProvider=cbList.dataProvider;
    cbValueChanged();
   }
   
   private function cbValueChanged():void{
    var item:Object=cbList.selectedItem;
    if(item is XML){
     if(cbBindType.selectedItem.value=="xml1")
      tiPrompt.text=XML(item).@value;
     else
      tiPrompt.text=XML(item).value;
    }
    else{
     tiPrompt.text=item.value;
    }
   }
   
  ]]>
 </mx:Script>
 <mx:Model id="mType">
  <root>
   <item label="Xml属性绑定" value="xml1"/>
   <item label="Xml节点绑定" value="xml2"/>
   <item label="XmlList绑定" value="xml3"/>
   <item label="Array绑定" value="array"/>
  </root>
 </mx:Model>
 <mx:ComboBox x="52" y="20" id="cbBindType" dataProvider="{mType.item}" labelField="label" width="152">
 </mx:ComboBox>
 <mx:ComboBox x="52" y="70" id="cbList" width="152" change="cbValueChanged()">
 </mx:ComboBox>
 <mx:Label x="9" y="22" text="绑定类型"/>
 <mx:Button x="236" y="20" label="绑定" click="binddata()"/>
 <mx:TextInput x="52" y="100" id="tiPrompt" />
    <mx:DataGrid id="grid1" height="107" x="236" y="69" width="240">
        <mx:columns>
            <mx:DataGridColumn headerText="label" dataField="label"/>
            <mx:DataGridColumn headerText="value" dataField="value"/>
        </mx:columns>
    </mx:DataGrid>

</mx:Application>

posted @ 2010-03-09 16:31  在路上...  阅读(6461)  评论(0编辑  收藏  举报