Flex: Row index in Datagrid when 'selectable' is set to 'false'

1.5k Views Asked by At

It would be an easy question, but property 'selectable' is set to 'false' and therefore selectedItem is always null.

In each row I have 3 buttons. When I click a button, I need to extract data corresponding to clicked row.

Any ideas how can I do that? Thanks.

2

There are 2 best solutions below

0
On

I assume you are using the MX DataGrid, correct?

In your itemRenderer, reference the listData property and convert it to DataGridListData.

When the button is clicked dispatch a custom event that includes the rowIndex. You should be able to use the rowIndex to get the selected item out of your dataProvider.

0
On

This is my item renderer

<?xml version="1.0" encoding="utf-8"?>
<s:MXDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                          xmlns:s="library://ns.adobe.com/flex/spark" 
                          xmlns:mx="library://ns.adobe.com/flex/mx" 
                          focusEnabled="true">
    <fx:Script>
        <![CDATA[
            public var parentView:Object;

            public static function getEditDeleteRenderer(view:Object):ClassFactory{
                var editDeleteRenderer:ClassFactory = new ClassFactory(EditDeleteRenderer);
                editDeleteRenderer.properties = { parentView:view  };
                return editDeleteRenderer;
            }

            function editItem():void{
                parentView.editItem(data);
            }
            function deleteItem():void{
                parentView.deleteItem(data);
            }
        ]]>
    </fx:Script>
    <mx:HBox paddingLeft="5">
        <mx:Image source="assets/edit.png" click="editItem()" />
        <mx:Image source="assets/delete.png" click="deleteItem()" />        
    </mx:HBox>
</s:MXDataGridItemRenderer>

This is how I use it

<mx:DataGridColumn headerText="Activity" width="100" itemRenderer="{EditDeleteRenderer.getEditDeleteRenderer(this)}" />

        public function editItem(foo:Foo){
                    // do edit operation
        }


        public function deleteItem(foo:Foo):void{
                     // do delete operation
        }