I am trying to make a simple custom component that lays out
checkboxes and selects them based on an array or values that it is
bound to.
The dataProvider hold the list of possible checkboxes and the
selectedValue property holds the list of what should be checked.
Here is what I have so far, but I am struggling with how to bind it
properly so that when the selectedValue Array changes, the check
boxes update. The problem is that the Repeater dataProvider property
needs to be bound to the result of the function _checkBoxProvider AND
this function needs to be run again every time that selectedValue
changes. Is there another way to do this? I am stumped on how to
make this work. Let me know if you have any thoughts?
- Kevin
<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
[Bindable]
public var fldLabel:String; //adds a label
[Bindable]
public var dataProvider:ArrayCollection //holds info on the check
boxes to use in the form of
//{label:"somestring",selected:true or false,tip:"some
data tip"}
[Bindable]
public var selectedValue:Array; //hold an array of
selected values
private var _groupValue:Array = new Array(); //holds value to send
back to the server
private function _checkBoxProvider():ArrayCollection{
//this function should update the dataProvider's selected
property for each value is found in the selectValue array
var dp:ArrayCollection = new ArrayCollection();
for each(var row:Object in dp){
row.selected = _getSelected(row.label);
dp.addItem(row);
}
return dp;
}
private function _getSelected(value:String):Boolean{
for each(var item:String in selectedValue){
if(value == item){
_groupValue.push(value);
return true;
}
}
return false;
}
private function _updateFld(event:MouseEvent):void{
//This event will update the _groupValue, database
& model
}
]]>
</mx:Script>
<mx:Label id="myLabel" styleName="dbocllabel" text="{fldLabel}"
width="10%" />
<mx:Tile >
<mx:Repeater id="myChoice"
dataProvider="{_checkBoxProvider()????}">
<mx:CheckBox id="aliasenable"
selected="{myChoice.currentItem.selected}"
label="{myChoice.currentItem.label}"
toolTip="{myChoice.currentItem.tip}"
click="_updateFld(event);" />
</mx:Repeater>
</mx:Tile>
</mx:HBox>