I am having an un-predictable behavior of creating radio buttons in advancedDataGrid column using itemRenderer. Similar kind of problem has been reported at http://stackoverflow.com/questions/112036/creating-a-column-of-radiobuttons-in-adobe-flex. I tried to use the same procedure i.e. bind every radio button selectedValue and value attributes with the property specified in the property of the associated bean but still facing the problem.

The button change values! The selected button becomes deselected, and unselected ones become selected.

Here is the code of my advancedDataGrid:

<mx:AdvancedDataGrid id="adDataGrid_rptdata" 
    			width="100%" height="100%"
    			dragEnabled="false" sortableColumns="false" 
    			treeColumn="{action}"
    			liveScrolling="false"
    			displayItemsExpanded="true" >

    			<mx:dataProvider>
            		<mx:HierarchicalData source="{this.competenceCollection}" childrenField="competenceCriteria"/>
            	</mx:dataProvider>

    			<mx:columns>
    				<mx:AdvancedDataGridColumn headerText="" id="action" dataField="criteriaName" />

    				<mx:AdvancedDataGridColumn headerText="Periode 1" dataField="" width="200">
    					<mx:itemRenderer>
    						<mx:Component>
    							<mx:HBox horizontalAlign="center" width="100%" verticalAlign="middle">									
    								<mx:RadioButton name="period1" value="{data}" selected="{data.period1}" group="{data.radioBtnGrpArray[0]}" visible="{data.showRadioButton}" />
    							</mx:HBox>
    						</mx:Component>
    					</mx:itemRenderer>
    				</mx:AdvancedDataGridColumn>

    				<mx:AdvancedDataGridColumn headerText="Periode 2" dataField="" width="200">
    					<mx:itemRenderer>
    						<mx:Component>
    							<mx:HBox horizontalAlign="center" width="100%" verticalAlign="middle">									
    								<mx:RadioButton name="period2" value="{data}" selected="{data.period2}" group="{data.radioBtnGrpArray[1]}" visible="{data.showRadioButton}" />
    							</mx:HBox>
    						</mx:Component>
    					</mx:itemRenderer>
    				</mx:AdvancedDataGridColumn>

    				<mx:AdvancedDataGridColumn headerText="Periode 3" dataField="" width="200">
    					<mx:itemRenderer>
    						<mx:Component>
    							<mx:HBox horizontalAlign="center" width="100%" verticalAlign="middle">									
    								<mx:RadioButton name="period3" value="{data}" selected="{data.period3}" group="{data.radioBtnGrpArray[2]}" visible="{data.showRadioButton}" />
    							</mx:HBox>
    						</mx:Component>
    					</mx:itemRenderer>
    				</mx:AdvancedDataGridColumn>
    			</mx:columns>
    		</mx:AdvancedDataGrid>

Any work around is highly appreciated in this regard!