Question

是否有人知道如何通过复选框向数据网格添加新行。

示例：

  checkbox 1 : label (PS2)
  checkbox 2 : label (PS3)
  checkbox 3 : label (PSP)

通过选择其中一个或所有复选框，我可以添加新的Datagrid行。

  Datagrid

  Console           price
  row1 PS2           $20,
  row2 PS3           $30,
  row3 PSP           $15,

我希望这个例子足够清楚感谢

DJ

Answer 1

从CheckBox的dataProvider事件处理程序向DataGrid的change添加项目 - 确保检查现有项目（并在取消选中复选框时删除它们）以避免重复。如果您可以发布DataGrid的代码，我们可能会提供一个示例代码来说明如何执行此操作。

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
    creationComplete="create()">
    <mx:DataGrid id="dg" dataProvider="{dp}">
      <mx:columns>
        <mx:DataGridColumn dataField="console"/>
        <mx:DataGridColumn dataField="price"/>
      </mx:columns>
    </mx:DataGrid>
    <mx:CheckBox id="cb1" change="onCheck(event)"/>
    <mx:CheckBox id="cb2" change="onCheck(event)"/>
    <mx:CheckBox id="cb3" change="onCheck(event)"/>
    <mx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            private var prices:Array = ["$20", "$30", "$15"];
            private var labels:Array = ["PS1", "PS2", "PS3"];
            private var checkBoxes:Array;
            [Bindable]public var dp:ArrayCollection;
            private function create():void
            {
                checkBoxes = [cb1, cb2, cb3];
                for(var i:Number = 0; i < labels.length; i++)
                    CheckBox(checkBoxes[i]).label = labels[i];
                dp = new ArrayCollection([]);
            }
            private function onCheck(event:Event):void
            {
                var cb:CheckBox = CheckBox(event.currentTarget);
                var index:Number = indexOf(cb.label);
                if(cb.selected && index == -1)
                    dp.addItem({console:cb.label, 
                        price:prices[labels.indexOf(cb.label)]});
                else if(!cb.selected && index != -1)
                    dp.removeItemAt(index);
            }
            private function indexOf(str:String):Number
            {
                for(var i:Number = 0; i < dp.length; i++)
                {
                    var item:Object = dp.getItemAt(i);
                    if(item.console == str)
                        return i;
                }
                return -1;
            }
        ]]>
    </mx:Script>
</mx:Application>

Flex Datagrid通过复选框动态添加行

1 个答案: