2009-12-18 81 views
0
<mx:DataGrid id="dg" dataProvider="{cNumbersList}"> 
    <mx:columns> 
     <mx:DataGridColumn dataField="contactName" headerText="Name" width="50"/> 
     <mx:DataGridColumn dataField="contactNo" headerText="ContactNo" width="40"/> 
     <mx:DataGridColumn headerText="Select Contact Number" width="20"> 
      <mx:itemRenderer> 
       <mx:Component>enter code here 
        <mx:CheckBox selected="false" />    
       </mx:Component>       
      </mx:itemRenderer>      
     </mx:DataGridColumn>      
    </mx:columns> 
</mx:DataGrid> 

如何获得所有选中的项目到一个更多的新阵列plz帮助我的人复选框在数据网格渲染

回答

1

我们希望在数据网格中有一个允许多选的复选框。我们扩展了DataGrid对象:

package obj 
{ 
import mx.controls.DataGrid; 
import flash.display.Sprite; 
import flash.events.KeyboardEvent; 
import mx.controls.CheckBox; 
import mx.controls.listClasses.IListItemRenderer; 

public class CheckboxDataGrid extends DataGrid 
{ 

    override protected function selectItem(item:IListItemRenderer, 
           shiftKey:Boolean, ctrlKey:Boolean, 
           transition:Boolean = true):Boolean 
    { 
     // only run selection code if a checkbox was hit and always 
     // pretend we're using ctrl selection 
     if (item is CheckBox) 
      return super.selectItem(item, false, true, transition); 
     return false; 
    } 

    // turn off selection indicator 
    override protected function drawSelectionIndicator(
           indicator:Sprite, x:Number, y:Number, 
           width:Number, height:Number, color:uint, 
           itemRenderer:IListItemRenderer):void 
    { 
    } 

    // whenever we draw the renderer, make sure we re-eval the checked state 
    override protected function drawItem(item:IListItemRenderer, 
           selected:Boolean = false, 
           highlighted:Boolean = false, 
           caret:Boolean = false, 
           transition:Boolean = false):void 
    { 
     CheckBox(item).invalidateProperties(); 
     super.drawItem(item, selected, highlighted, caret, transition); 
    } 

    // fake all keyboard interaction as if it had the ctrl key down 
    override protected function keyDownHandler(event:KeyboardEvent):void 
    { 
     // this is technically illegal, but works 
     event.ctrlKey = true; 
     event.shiftKey = false; 
     super.keyDownHandler(event); 
    } 

} 
} 

我们还创建了一个CheckboxRenderer:

package obj 
{ 
import flash.display.DisplayObject; 
import flash.events.KeyboardEvent; 
import flash.events.MouseEvent; 
import flash.text.TextField 
import mx.controls.CheckBox; 
import mx.controls.dataGridClasses.DataGridListData; 
import mx.controls.listClasses.ListBase 

public class CheckBoxRenderer extends CheckBox 
{ 
    public function CheckBoxRenderer() 
    { 
     focusEnabled = false; 
    } 

    override public function set data(value:Object):void 
    { 
     super.data = value; 
     invalidateProperties(); 
    } 

    override protected function commitProperties():void 
    { 
     super.commitProperties(); 
     if (owner is ListBase) 
      selected = ListBase(owner).isItemSelected(data); 
    } 

    /* eat keyboard events, the underlying list will handle them */ 
    override protected function keyDownHandler(event:KeyboardEvent):void 
    { 
    } 

    /* eat keyboard events, the underlying list will handle them */ 
    override protected function keyUpHandler(event:KeyboardEvent):void 
    { 
    } 

    /* eat mouse events, the underlying list will handle them */ 
    override protected function clickHandler(event:MouseEvent):void 
    { 
    } 

    /* center the checkbox if we're in a datagrid */ 
    override protected function updateDisplayList(w:Number, h:Number):void 
    { 
     super.updateDisplayList(w, h); 

     if (listData is DataGridListData) 
     { 
      var n:int = numChildren; 
      for (var i:int = 0; i < n; i++) 
      { 
       var c:DisplayObject = getChildAt(i); 
       if (!(c is TextField)) 
       { 
        c.x = (w - c.width)/2; 
        c.y = 0; 
       } 
      } 
     } 
    } 
} 
} 

然后在您的Flash页面:

<obj:CheckboxDataGrid id="notificationsCheckboxGrid" 
dataProvider="{_myModel._grid}" 
allowMultipleSelection="true" 
showHeaders="false"        
change="emailAddressesSelected()"> 
<qmsAdmin:columns>          
    <mx:DataGridColumn width="20" sortable="false" itemRenderer="CheckBoxRenderer"/> 
    <mx:DataGridColumn width="150" dataField="email"/> 
    <mx:DataGridColumn dataField="notificationType"/> 
</qmsAdmin:columns>  
</obj:CheckboxDataGrid> 

通知改变方法 “emailAddressesSelected()”。调用此方法:

private function emailAddressesSelected():void 
{ 
_emailAddressIndexesSelected = notificationsCheckboxGrid.selectedIndices; 
} 

_emailAddressIndexesSelected是被定义为在类只是一个Array对象:

private var _emailAddressIndexesSelected:Array; 
0

你可以把其他字段到您的接触类 - “选择”或“检查” - 和当选择复选框更改时,使用itemRenderer设置此值。然后,您可以简单地循环访问您的联系人dataProvider并查看哪些被选中。

你可以这样做:

<mx:Component> 
    <mx:CheckBox id="contactCheckBox" selected="{data.contactSelected}" change="data.contactSelected = contactCheckBox.selected"/>    
</mx:Component>  

渲染器得到的接触作为其数据。我没有测试过,但它应该在原则上工作。让我知道如果代码出现问题。