Checkbox in dynamically generated DataGrid - how to retrieve selected value

Question

I want to have a column in my dataGrid with checkboxes in it. My code that creates grid with the column looks like this:

var dataGrid:DataGrid=new DataGrid();
var preparedColumns:Array=[];
preparedColumns.push(new DataGridColumn("DepCode"));
var checkboxColumn:DataGridColumn=new DataGridColumn("AddSegment");
checkboxColumn.itemRenderer=new ClassFactory(CheckBox);
checkboxColumn.editable=true;
preparedColumns.push(checkboxColumn);

for (var i:int=0; i < event.result.request.out.segments.segment.length; i++)
{
    var segment:Object=event.result.request.out.segments.segment[i];
    var addSegmentCheckbox:CheckBox=new CheckBox();
    preparedValues.addItem({DepCode: segment.departureCode, AddSegment: addSegmentCheckbox});
    addSegmentCheckbox.id = ""+i;
    addSegmentCheckbox.addEventListener(Event.CHANGE, changeCheckboxState);
    checkboxValues[i] = false;
}
dataGrid.columns=preparedColumns;
dataGrid.dataProvider=preparedValues;

This works, at least it renders what I want but I can't figure out how to read if user selected checkbox in given row or not. I've seen that often there are added function onChange to the checkbox but I can't figure out how to do it when I use factory (most examples I found don't create itemRenderer in code but with the use of tags).

I tried to read data like this but checkbox.selected turn out to be false no matter if I checked the checkbox or not.

public function OKButtonClick(event:MouseEvent):void
{
    for (var i:int=0; i < preparedValues.length; i++)
    {
        var row:Object=preparedValues[i];
        var checkbox:CheckBox=row.AddSegment;
        if (checkbox.selected == true)
        {           
        }
    }
}

I tried to add a listener for checkboxes as suggested in the loop but the listener method isn't executed when checkboxes states change (I checked it in debugger). I updated the first code part above and added following method:

public function changeCheckboxState(event:Event):void {
var i:int = event.currentTarget.id; if (checkboxValues[i] == true) { checkboxValues[i] == false;
} else { checkboxValues[i] == true;
} }

Table checkboxValues never changes (I set it up all to false at the beginning) and the above method is never executed.

In general, you shouldn't have to access ItemRenderers. You should rather create a custom itemrenderer and bind the selection of the checkbox to a property of the underlying data record. Maybe this can help: stackoverflow.com/questions/6146006/… — RIAstar

Michael Brewer-Davis Michael Brewer-Davis · Accepted Answer · 2013-01-02T16:37:14

You should listen for Event.CHANGE instead of for the mouse click itself (that way you know you're getting the event after the framework has updated selected).

From there, you should be able to get the owner of the checkbox (as an ItemRenderer), and retrieve the data for that cell.

Checkbox in dynamically generated DataGrid - how to retrieve selected value

1 Answers