2 Replies Latest reply on Dec 15, 2010 10:58 AM by Wang4181

    How to disable items (gray out) in DataGrid control?

    Wang4181 Level 1



      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:




      <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: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:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="60" >



                     private function setInUse() : void


                          _data.selected = listInUse.selected;




        <mx:CheckBox id="listInUse" width="18" height="18" click="setInUse()" selected="{_data.selected}"/>