Flex DataGrid with row number column

Question

I want to extend the DataGrid component so that there is a (read-only) column for the row number like you see in spreadsheets. I came across this article http://www.cflex.net/showFileDetails.cfm?ObjectID=735 but it depends on the data being unique for each row so that it can index into the array. If the data is not unique (like for an empty grid) it doesn't work. How can I implement that?

Solution 1

I was able to do this by implementing a custom itemRenderer, RowNumberRenderer.as

package com.domain
{
    import mx.collections.IList;
    import mx.controls.Label;
    import mx.controls.listClasses.ListBase;

    public class RowNumberRenderer extends Label
    {
        public function RowNumberRenderer()
        {
            super();
        }

        override public function set data(value:Object):void
        {
            super.data = value;
            this.text = String(IList(ListBase(listData.owner).dataProvider).getItemIndex(data) + 1);                     
        }

    }
}

Solution 2

This worked for me:

<mx:Label xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
    <![CDATA[
        import mx.controls.AdvancedDataGrid;

        private var handleDataChangedEnabled:Boolean = false;

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

            if (!handleDataChangedEnabled) {
                addEventListener("dataChange", handleDataChanged);
            }
        }

        public function handleDataChanged(event:Event):void {
            this.text = String(listData.rowIndex + (listData.owner as AdvancedDataGrid).verticalScrollPosition + 1);
        }
    ]]>
</mx:Script>

Of course, you would have to change AdvancedDataGrid to DataGrid.

Cheers.