AdvancedDataGrid每列添加複選框和圖標以及全選功能

<fx:Script>
  <![CDATA[

          //實現全選功能

           public function checkbox1_clickHandler(event:MouseEvent):void
            {
                 // TODO Auto-generated method stub
                   bool = (event.currentTarget as CheckBox).selected;
                 var newAC:ArrayCollection = dgDedicated.dataProvider as ArrayCollection;
    
                  for(var i:int=0; i<newAC.length; i++){
                            newAC.getItemAt(i).selected = bool;
                   }
    
                  newAC.refresh(); 
    
            }
  ]]>
 </fx:Script>

 

<mx:AdvancedDataGrid width="100%" height="65%" id="dgDedicated" dataProvider="{ac}"
        draggableColumns="false" sortExpertMode="true" rowHeight="25" headerHeight="25"
        sortableColumns="false" lockedColumnCount="1"
        horizontalScrollPolicy="auto" verticalScrollPolicy="auto"
        >
   <mx:columns>
    <mx:AdvancedDataGridColumn dataField="num">
     
     <mx:headerRenderer>
      <fx:Component>
       <mx:HBox height="25" paddingLeft="5">
        <s:CheckBox id="cb"  label="序號" click="outerDocument.checkbox1_clickHandler(event)"/>
       </mx:HBox>
      </fx:Component>
     </mx:headerRenderer>
     
     <mx:itemRenderer>
      <fx:Component>
       <components:EditColumnGrid txt="{data.num}" paddingLeft="5" paddingRight="5"
                imageClickEvent="outerDocument.onClickIconHandler(event)"/>

<!--  渲染器裏面調用自定義的imageClickEvent就將事件派發出去了  -->


      </fx:Component>
     </mx:itemRenderer>
    </mx:AdvancedDataGridColumn>
    <mx:AdvancedDataGridColumn headerText="名稱" dataField="name">
     <mx:itemRenderer>
      <fx:Component>
       <mx:Label text="{data.name}" mouseDown="itemMouseDownHandler(event)"
           mouseUp="itemMouseUpHandler(event)">

        <fx:Script>
         <![CDATA[
          import mx.controls.Alert;
          //點擊單元格查看詳細信息
          protected function itemMouseUpHandler(event:MouseEvent):void
          {
           // TODO Auto-generated method stub
           Alert.show(data.name+".....");
           
           //    parentDocument.md.visible = false;
          }
          
          protected function itemMouseDownHandler(event:MouseEvent):void
          {
           // TODO Auto-generated method stub
          }
         ]]>
        </fx:Script>

       </mx:Label>
      </fx:Component>
     </mx:itemRenderer>
    </mx:AdvancedDataGridColumn>
    <mx:AdvancedDataGridColumn headerText="地市" dataField="city"/>
    <mx:AdvancedDataGridColumn headerText="IP地址" dataField="ip"/>
   </mx:columns>
  </mx:AdvancedDataGrid>

 

下面是EditColumnGrid類

<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:fx="http://ns.adobe.com/mxml/2009"
   xmlns:s="library://ns.adobe.com/flex/spark"
   xmlns:mx="library://ns.adobe.com/flex/mx" height="25" horizontalGap="0">
 <fx:Metadata>
  [Event(name="imageClickEvent",type="common.events.DataGridImageClickEvent")]
 </fx:Metadata>
 <fx:Declarations>
  <!-- 將非可視元素(例如服務、值對象)放在此處 -->
 </fx:Declarations>
 <fx:Script>
  <![CDATA[
   import common.events.DataGridImageClickEvent;
   [Bindable]
   private var _txt:String;
   public function set txt(lab:String):void{
    _txt = lab;
   }
   public function get txt():String{
    return _txt;
   }

   protected function img_clickHandler(event:MouseEvent):void
   {
    // TODO Auto-generated method stub
    this.dispatchEvent(new DataGridImageClickEvent("imageClickEvent",event.currentTarget.name,null));
   }


   protected function sec_clickHandler(event:MouseEvent,data:Object):void
   {
    // TODO Auto-generated method stub
    this.dispatchEvent(new DataGridImageClickEvent("imageClickEvent",event.currentTarget.name,data));
   }
   
   override public function set data(value:Object):void{
    super.data = value;
    if(data==null){
     return;
    }
    if(data.selected==true){
     sec.selected = true;
    }else{
     sec.selected = false;
    }
   }

  ]]>
 </fx:Script>
 <s:CheckBox id="sec" label="{_txt}" selected="{data.selected}" name="sec" click="sec_clickHandler(event,data)"/>
 <s:Spacer width="80%"/>
 <s:Image source="@Embed(source='assets/imgs/updata.png')"
    toolTip="修改" id="modify" name="modify" click="img_clickHandler(event)"/>
 <s:Image source="@Embed(source='assets/imgs/delete.png')"
    toolTip="刪除" id="del" name="del" click="img_clickHandler(event)"/>
</mx:HBox>

 

 

事件派發類DataGridImageClickEvent

package common.events
{
 import flash.events.Event;
 
 public class DataGridImageClickEvent extends Event
 {
  private var _imageName:String;
  private var _dataObj:Object;
  public function DataGridImageClickEvent(type:String,imgName:String,dataObj:Object)
  {
   super(type);
   _imageName = imgName;
   _dataObj = dataObj;
  }
  /**
   * 得到圖片的name屬性
   */
  public function get imageName():String{
   return _imageName;
   
  }
  public function get dataObj():Object{
   return _dataObj;
  }
  override public function clone():Event{
   return new DataGridImageClickEvent(type,_imageName,_dataObj);
  }
 }
}

 

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章