StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>HI!</p> <p>First of all, your code will not work properly, since not every DataGrid row has its own ItemRenderer instance. There are exactly n item renderer instances for a DataGrid having n VISIBLE rows. You can check this easily, if you create DataGrid, that can not fit all the data and then select some rows and scroll datagrid up/down. You'll see unexpected results.</p> <p>One of solutions could be having additional field "selected" (or whatever you want to name it) in resultArray item properties. Then you can access this property through "data" object of ItemRenderer. Check the code below:</p> <pre><code><?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"> <fx:Script> <![CDATA[ import mx.collections.ArrayCollection; [Bindable] private var resultArray:ArrayCollection = new ArrayCollection ([ {firstName:"1-1",lastName:"1-2",city:"1-3",empCode:"1-4"}, {firstName:"2-1",lastName:"2-2",city:"2-3",empCode:"2-4"}, {firstName:"3-1",lastName:"3-2",city:"3-3",empCode:"3-4"}, {firstName:"4-1",lastName:"4-2",city:"4-3",empCode:"4-4"}, {firstName:"5-1",lastName:"5-2",city:"5-3",empCode:"5-4"}, {firstName:"6-1",lastName:"6-2",city:"6-3",empCode:"6-4"}, {firstName:"7-1",lastName:"7-2",city:"7-3",empCode:"7-4"}, {firstName:"8-1",lastName:"8-2",city:"8-3",empCode:"8-4"}, {firstName:"9-1",lastName:"9-2",city:"9-3",empCode:"9-4"}, {firstName:"10-1",lastName:"10-2",city:"10-3",empCode:"10-4"}, ]); protected function button1_clickHandler(event:MouseEvent):void { for (var i:int=0; i< resultArray.length; i++) { if (resultArray[i].selected == true) { resultArray.removeItemAt(i); } } dgEmployeeInfo.invalidateList(); } ]]> </fx:Script> <fx:Declarations>  </fx:Declarations> <s:VGroup> <mx:DataGrid id="dgEmployeeInfo" dataProvider="{resultArray}" x="131" y="95" editable="false"> <mx:columns> <mx:DataGridColumn headerText="Select" rendererIsEditor="true" editorDataField="selected"> <mx:itemRenderer> <fx:Component> <mx:HBox> <s:CheckBox id="testChk" click="testChk_clickHandler(event)" selected="{data.selected}"> <fx:Script> <![CDATA[ [Bindable] public var cbSelected:Boolean; protected function testChk_clickHandler(event:MouseEvent):void { data.selected = testChk.selected; } ]]> </fx:Script> </s:CheckBox> </mx:HBox> </fx:Component> </mx:itemRenderer> </mx:DataGridColumn> <mx:DataGridColumn headerText="First Name" dataField="firstName"/> <mx:DataGridColumn headerText="Last Name" dataField="lastName"/> <mx:DataGridColumn headerText="City" dataField="city"/> <mx:DataGridColumn headerText="Employee Code" dataField="empCode"/> </mx:columns> </mx:DataGrid> <mx:Button label="Delete Items" click="button1_clickHandler(event)"/> </s:VGroup> </s:Application> </code></pre> <p>I used ArrayCollection as dataProvider as it is much mor easier to add/remove items to Collection objects then with Arrays.</p> <p>Regards.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload