Flexicious DataGrid Custom Button for expanding nextLevel

Question

I'm just learning how to use Flexicious DataGrid and I have a problem. When I'm setting up my DataGrid I do this:

 var flexDataGridColumnLevel:FlexDataGridColumnLevel = new FlexDataGridColumnLevel();
    flexDataGridColumnLevel.columns = columns;
    flexDataGridColumnLevel.nextLevelRenderer = new ClassFactory(ExampleNextLevelRenderer);
    flexDataGridColumnLevel.selectedKeyField = "entityId";

    this._view.grid2.columnLevel = flexDataGridColumnLevel;

In order to have a next level on my columns. When I do this, the little "+" button cell is added as the first cell in each row. Adding a whole new column. I don't want this though.

I want to essentially hijack that "+" icon functionality, but add it into a different button. In my rows, I have one column that for each row in that column there is a button. When the user clicks that button THEN I want to expand the row; doing what clicking that "+" icon normally does. Also, I don't want the "+" icon to show at all.

I can't figure out how to do this at all and can't find any examples on the internet.

Thanks for the help!

Answer 1

Set enableDefaultDisclosureIcon=false on the grid, You can also use enableExpandCollapse=true on any column to control which column has the expand collapse icon. If you want to use a custom button, Use an itemRenderer and on click call

var cell:IFlexDataGridCell = parent as IFlexDataGridCell;
cell.level.grid.expandChildrenOf(cell.rowInfo.data))