How can you set checkboxes in a DataGrid to either be selected or not, depending on a column's value, in AS3?

Question

I'm using a custom DataGrid subclass provided by the code at the top of this page:

http://blogs.adobe.com/aharui/2008/02/checkbox_selection_in_datagrid.html

I'm effectively supplying it an ArrayCollection of two-column DataRows pulled out of a VB.NET webservice. One of the columns is called "isSelected" and is set to either "True" or "False", and it's the only column being represented by the checkboxes. Everything is going perfectly, except that I want the code to be able to go in and check and uncheck the checkboxes - at least depending on what the value of isSelected is. My code reads everything out of those checkboxes just fine, with the user being able to set them just fine; it's just that the DataGrid component is very concealed and confusing to work with, so I haven't found a way yet to make the code itself set specific checkboxes to either be selected or unselected.

How do you do this? Thanks!

EDIT: The code for the renderer at the moment is this:

package 
{
import flash.display.DisplayObject;
import flash.events.KeyboardEvent;
import flash.events.MouseEvent;
import flash.text.TextField;

import mx.controls.Alert;
import mx.controls.CheckBox;
import mx.controls.dataGridClasses.DataGridListData;
import mx.controls.listClasses.ListBase;

/** 
*  The Renderer.
*/
public class CheckBoxRenderer extends CheckBox
{
private var _data:*;  
private var selectedSet:Boolean;

override public function set data(value:Object):void {  
    var newSelected:*;  

    //so we don't have to rewrite the label stuff  
    super.data=value;  
    _data = value;  

    if (listData && listData is DataGridListData && DataGridListData(listData).dataField != null)  
    {  
        newSelected = _data[DataGridListData(listData).dataField];  
    }  
    else if (listData)  
    {  
        if (selectedField)  
            newSelected = _data[selectedField];  
    }  
    else  
    {  
        newSelected = _data;  
    }  

    if (newSelected !== undefined)  
    {
        /*if (newSelected is XMLList) {  
            newSelected = newSelected[0];  
            selected = (newSelected == 'true' ? true : false);  
        } else {
            selected = newSelected as Boolean;  
        }*/
        selected = (newSelected == "True" ? true : false);
    }
}  

public function CheckBoxRenderer()
{
    focusEnabled = false;
}

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

override protected function commitProperties():void
{
    super.commitProperties();
    if (owner is ListBase)
        selected = ListBase(owner).isItemSelected(data);
}

/* eat keyboard events, the underlying list will handle them */
override protected function keyDownHandler(event:KeyboardEvent):void
{
}

/* eat keyboard events, the underlying list will handle them */
override protected function keyUpHandler(event:KeyboardEvent):void
{
}

/* eat mouse events, the underlying list will handle them */
override protected function clickHandler(event:MouseEvent):void
{
}

/* center the checkbox if we're in a datagrid */
override protected function updateDisplayList(w:Number, h:Number):void
{
    super.updateDisplayList(w, h);

    if (listData is DataGridListData)
    {
        var n:int = numChildren;
        for (var i:int = 0; i < n; i++)
        {
            var c:DisplayObject = getChildAt(i);
            if (!(c is TextField))
            {
                c.x = (w - c.width) / 2;
                c.y = 0;
            }
        }
    }
}

}

}

The selected field for the checkboxes is getting set to the right thing, but it's not visually showing up as being check when selected gets set to true. What else am I missing?

Answer 1

The problem is not with DataGrid, but with Checkbox, which is not implemented correctly. See my comments here for code on how to override set data so that if the dataField contains true, selected will work. You'll need to look at the pathway for XMLList for some ideas on how to tweak it to work for your value of "True." Or you could convert that value to the boolean true.

Answer 2

first, make the objects contained in your arraycollection as bindable. if you want to programmatically check or uncheck the checkboxes, you simply assign value directly to object's attribute.

Given:

 <mx:DataGrid id="mygrid" dataProvider="{mycollection}"/>

...

 [Bindable]
 var mycollection:ArrayCollection = new ArrayCollection([....]);

....

set first row to checked:

   var firstItem:MyObject = mycollection.getItemAt(0);
   firstItem.isSelected = true; // or false

The checkbox item renderer should automatically reflect the state of the column.