flex datagrid checkbox选中项目

Bertha 。 2021-11-11 03:10 271阅读 0赞

<?xml version="1.0" encoding="utf-8"?>   
<mx:Application xmlns:fx="[http://ns.adobe.com/mxml/2009][http_ns.adobe.com_mxml_2009]"    
   xmlns:s="library://ns.adobe.com/flex/spark"    
   xmlns:mx="library://ns.adobe.com/flex/mx">   
   
 <fx:Script>   
  <!\[CDATA\[  
   import mx.collections.ArrayCollection;  
   import mx.controls.Alert;  
     
   //数据源  
   \[Bindable\]  
   private var dsObjects:ArrayCollection = new ArrayCollection(\[  
    \{flag:false,name:"Chen",job:"developer"\},  
    \{flag:false,name:"men",job:"mentor"\},  
   \]);  
     
   /\*  
   \*实现所有项目的全选中过程   
   \*/  
   public function all\_click(event:Event):void\{  
      
    dsObjects = this.dgDistbRecordSearchList.dataProvider as ArrayCollection;  
    this.unAll.selected = false;  
    for(var i:int = 0 ;i<dsObjects.length;i++)\{  
     dsObjects\[i\].flag = CheckBox(event.target).selected;  
    \}  
    //重新绑定  
    this.dgDistbRecordSearchList.dataProvider = dsObjects;  
   \}  
   /\*  
   \*实现项目反相选中  
   \*/  
   public function unAll\_click(event:Event):void\{  
      
    if(CheckBox(event.target).selected)\{  
       
     this.all.selected = false;  
       
     dsObjects = this.dgDistbRecordSearchList.dataProvider as ArrayCollection;  
       
     for(var i:int = 0 ;i<dsObjects.length;i++)\{  
      dsObjects\[i\].flag = !dsObjects\[i\].flag;  
     \}  
     //重新绑定  
     this.dgDistbRecordSearchList.dataProvider = dsObjects;  
    \}  
   \}  
     
   //显示被选中项目的名称  
   private function showSelectedName():void\{  
    var ac:ArrayCollection = this.dgDistbRecordSearchList.dataProvider as ArrayCollection;  
    var selectedNames:String = "选中项目名称为："  
      
    for(var i:int = 0;i<ac.length;i++)\{  
     if(ac\[i\].flag == true)\{  
      selectedNames += ac\[i\].name + " ";  
     \}  
    \}  
      
    Alert.show(selectedNames);  
   \}  
  \]\]>   
 </fx:Script>   
 <mx:VBox>   
  <mx:DataGrid id="dgDistbRecordSearchList" width="100%" height="100%" allowMultipleSelection="true" dataProvider="\{dsObjects\}" >                  
   <mx:columns>   
    <mx:DataGridColumn headerText="选择" width="42" >   
     <mx:itemRenderer >   
      <fx:Component >   
       <mx:HBox horizontalAlign="center">   
        <mx:CheckBox selected="@\{data.flag\}"  change="checkbox1\_changeHandler(event,data)" width="13">   
         <fx:Script>   
          <!\[CDATA\[  
           import mx.events.ListEvent;  
           protected function checkbox1\_changeHandler(event:Event,obj:Object):void  
           \{  
            //调整按钮选择性  
            outerDocument.unAll.selected = false;  
            outerDocument.all.selected = false;  
            //在单向绑定时可采用此法将选中信息反应到数据源  
            /\*  obj.flag =  CheckBox(event.target).selected;  \*/  
           \}  
          \]\]>   
         </fx:Script>   
        </mx:CheckBox>   
       </mx:HBox>   
         
      </fx:Component>   
     </mx:itemRenderer>   
    </mx:DataGridColumn>   
    <mx:DataGridColumn id="nam" textAlign="left" headerText="姓名" dataField="name"/>   
    <mx:DataGridColumn id="job" textAlign="left" headerText="职位" width="80" dataField="job"/>   
   </mx:columns>   
  </mx:DataGrid>   
  <mx:HBox>   
   <s:CheckBox id="all" label="全选" width="45" height="30" click="all\_click(event)"/>   
   <s:CheckBox id="unAll" label="反选" width="45" height="30" click="unAll\_click(event)"/>   
  </mx:HBox>   
  <mx:Button label="选中项目的名称" click="showSelectedName()" />   
    
 </mx:VBox>   
   
</mx:Application>

转载于:https://www.cnblogs.com/wshsdlau/p/3436437.html

[http_ns.adobe.com_mxml_2009]: http://ns.adobe.com/mxml/2009