9 | Stephen Gray
3 September, 2008 at 9:28 am

I just spent a few hours trying to build something to do what you want because I’ve not done this kind of thing before. Then I came across this, which is EXACTLY what I was trying to do

http://blog.classsoftware.com/index.cfm/2007/6/11/Flex-Datagrid-Edit-Cell-on-Row-Click

Not annoying at all! Hope it helps anyway. The interesting function is the editCell one, I’ll keep this one in mind for future

11 | Stephen Gray
4 September, 2008 at 2:35 pm

Hi Mary,

Sorry I misunderstood your original problem I’ve been investigating again and I’ve come across an interesting idea which may help.

Basically you create a simple custom DataGrid class which adds a getter method for returning an array of all itemRenderers for all rows.

Then on your ‘click’ function you loop through this array, check to see if the renderer corresponds to the row that was clicked and then do something with it. In the example I found he was using this method to make that row’s itemRenderer turn the row bold, but I’m sure it could be modified to make the itemRenderer hidden?

The example I found is: http://blog.paranoidferret.com/index.php/2008/09/02/accessing-datagrid-itemrenderers/

I was thinking the line you could change to hide the itemRenderer could be:

rowRenderers[i][j].setStyle("fontWeight", "bold");

What would happen if you change this to:

rowRenderers[i][j].visible = false;

I haven’t tested this so I don’t even know if it’s possible, but worth a try

Stephen.

13 | Stephen Gray
19 September, 2008 at 3:22 pm

Hi benjamin,

Thanks for the comment, I’m glad it helped!

Stephen.

15 | Stephen Gray
17 October, 2008 at 2:50 pm

Hi Nithya,

Sorry for the late, late, late reply, been crazily busy lately!

So your exact issue is;

You want a button as an itemRenderer in a DataGrid and when you click the button, you want to load a page (or State etc) with details relating to that row?

Say if you had a simple DataGrid with two columns (Project name, View) with the second column containing a button, you could do something like this:

<mx:Script>
    <![CDATA[
        protected function viewSelectedProject():void
        {
            var selectedProject:Object = ProjectDataGrid.selectedItem;
            Alert.show('Project name: '+selectedProject.project_name);
        }
    ]]>
</mx:Script>
<mx:DataGrid selectionMode="singleRow" id="ProjectDataGrid">
    <mx:columns>
        <mx:DataGridColumn headerText="Project name" dataField="project_name"/>
        <mx:DataGridColumn headerText="View">
            <mx:itemRenderer>
                <mx:Component>
                    <mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml">
                        <mx:Script>
                            <![CDATA[
                                protected function viewProject(event:MouseEvent):void
                                {
                                    outerDocument.viewSelectedProject();
                                }
                            ]]>
                        </mx:Script>
                        <mx:Button label="View" click="viewProject(event);"/>
                    </mx:Canvas>
                </mx:Component>
            </mx:itemRenderer>
        </mx:DataGridColumn>
    </mx:columns>
</mx:DataGrid>

Let me know if it works! Not tested!

Stephen.

17 | Stephen Gray
3 November, 2008 at 12:25 pm

Hi Zima,

Sorry for the late reply.

There’s no native method to hide a row so you’ll most likely have to use either .removeChildAt to remove the row, or take the row out of the DataGrid’s dataProvider and re-assign it to the table.

Hope it helps,
Stephen.