DataGrid column/row selection based on checkbox

[Booma Devi]

Hi,

Can any one please tell me how to edit only one row ( other rows should not be editable if checkbox is not selected) based on the checkbox selection in datagrid using flex 4.5....


When i click the checkBox and EDIT button, I am able to edit all the rows in the datagrid... But my requirement is when i click the checkbox and EDIT button, I want to edit the selectable row only...

Here is my code:

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			   xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
	<s:layout> 
		<s:VerticalLayout/> 
	</s:layout> 
	
	<fx:Declarations>
	
		
	</fx:Declarations>
	<fx:Script> 
		<![CDATA[ 
			import mx.controls.CheckBox;
			
			import spark.components.Grid;
			import spark.components.TextInput;
			import spark.events.GridEvent;
			import spark.events.GridSelectionEvent;
			import spark.components.gridClasses.GridColumn;
			import spark.components.gridClasses.GridSelectionMode;
			
			
						
			[Bindable]                 
			private var ac:ArrayCollection=new ArrayCollection([{artist: "John", album:"AAA", price:"100.01", selected: false}, 
				{artist: "Jai", album:"BBB", price:"101.01", selected: false}, {artist: "Jack", album:"CCC", price:"110.01", selected: false}]);
			
			private function deleteRows():void                
			{                         
				for each (var row:Object in ac)                         
				{                                
					if (row.selected == true)                                 
					{                                        
						var i:int=ac.getItemIndex(row);                                         
						ac.removeItemAt(i);                                
					}                         
				}                 
			} 
			
			public function editRows(event:MouseEvent):void
				
			{
				for each (var row:Object in ac)                         
				{                                
					if (row.selected == true)                                 
					{                                        
						                                      
						myDG.editable=true ;
						
						
					}   
					else
					{
						myDG.editable=false; 
					}
				}
				
				
			}
			
			protected function gridClickEvent(event:GridEvent):void { 
				clickColumn.text = String(event.columnIndex); 
				clickRow.text = String(event.rowIndex);
										
			 
								
				
			} 
			
			
			
			protected function select(event:MouseEvent):void
			{
				
				hc.editable=false;
				
			}
			
			

		]]> 
	</fx:Script> 
	
		<s:DataGrid id="myDG" width="50%" height="50%" dataProvider="{ac}"
				gridClick="gridClickEvent(event);"   editable="false"> 
		
		<s:columns>
			<s:ArrayCollection>
				<s:GridColumn id="hc" dataField="shouldDelete" rendererIsEditable="true" headerRenderer="CheckBoxSample">
					<s:itemRenderer>
						<fx:Component>
							<s:GridItemRenderer>
								<s:CheckBox id="cb" selected="{data.selected}" change="data.selected=selected"/>
							</s:GridItemRenderer>
							
						</fx:Component>
					</s:itemRenderer>
				</s:GridColumn>
				<s:GridColumn dataField="artist" headerText="ARTIST"/>
				<s:GridColumn dataField="album" headerText="ALBUM"/>
				<s:GridColumn dataField="price" headerText="PRICE" >
					<s:itemEditor> 
						<fx:Component> 
							<s:ComboBoxGridItemEditor> 
								<s:dataProvider>
									<s:ArrayList>
										<fx:String>100</fx:String>
										<fx:String>200</fx:String>
										<fx:String>300</fx:String>
									</s:ArrayList>
								</s:dataProvider>
							</s:ComboBoxGridItemEditor> 
						</fx:Component> 
					</s:itemEditor>    
				</s:GridColumn>
				
			</s:ArrayCollection>
		</s:columns>
	</s:DataGrid> 
	
	
	<s:Label text="Selected Column:"/> 
	<s:TextArea id="clickColumn" height="50"/> 
	
	<s:Label text="Selected ROW:"/> 
	<s:TextArea id="clickRow" height="50"/> 
	<s:TextArea id="cellInfo" width="300" height="150" />
	
	
	<s:Button id="button" label="EDIT" click="editRows(event);"/>
	<s:Button label="DELETE" id="deleteBtn" click="deleteRows()"/>
	<s:CheckBox id="cb" visible="false" selected="false"/>
</s:Application>