Hi,
I need to implement a custom component to have a selectable list with a maximum selected items.
that is, when the selected items reach the max number, all un-selected items will be gray out.
Now I am able to use DataGrid control to display a selectable "checkbox" (through itemRenderer) at first column, to let user select the item.
And the list name in second column.
But I can't find a way to gray out (disable) those un-selected item when max is reached.
Can anyone give any advise?
Here is my code snippet:
SelectableListView.mxml
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%" visible="true">
<mx:DataGrid id="list_datagrid" dataProvider="{this.stringList}" showHeaders="false"
editable="false" selectable="true" verticalGridLines="false" borderStyle="none" alternatingItemColors="[#F8F8F0, #FFFFFF]"
left="5" rowCount="16" rowHeight="20" height="83" width="100%" top="0" doubleClickEnabled="true" doubleClick="onDoubleClick(event)" >
<mx:columns>
<mx:DataGridColumn id="listCheckBox_col" dataField="selected" editable = "false"
itemRenderer="ListRenderer" width="18" headerText="" resizable="false" draggable="false"/>
<mx:DataGridColumn id="listName_col" dataField="name" />
</mx:columns>
</mx:DataGrid>
</mx:VBox>
ListRenderer.mxml
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="60" >
<mx:Script>
<![CDATA[
private function setInUse() : void
{
_data.selected = listInUse.selected;
}
]]>
</mx:Script>
<mx:CheckBox id="listInUse" width="18" height="18" click="setInUse()" selected="{_data.selected}"/>
</mx:Canvas>
