Edit DataGrid Problem

Could you please give me a better suggession to solve this problem…?

 
import fl.controls.*;
var dg:DataGrid = new DataGrid();
dg.columns = [ "col1", "col2", "col3" ];
dg.move(200,10);
dg.setSize(200,300);
addChild(dg);
dg.addItem( { col1:"Name", col2:"Date", col3:"Size" } );  
dg.addItem( { col1:"Name1", col2:"Date1", col3:"Size1" } ); 
 
var rowIntro:Label = new Label();
rowIntro.text = "edit item :";
rowIntro.move(10,10);
var rowInputField:TextInput = new TextInput();
rowInputField.move(60,10);
rowInputField.setSize(120,20);
var editButton:Button = new Button();
editButton.move(70,40);
editButton.label = "Apply";
editButton.addEventListener(MouseEvent.CLICK,editGrid);
addChild(rowIntro);
addChild(rowInputField);
addChild(editButton);
function editGrid(e:MouseEvent):void {
 
 trace(dg.selectedItem.col2);
 var newText = rowInputField.text
 dg.selectedItem.col2 = newText;
}

[COLOR=red]here iam trying to replace the 2nd Coloumn of the selected Item with a TextInput, [/COLOR]
[COLOR=red]When I click the button the item replaced, but I have to click the next row to view the change, How I can view the change on button click (with out selecting the DataGrid)[/COLOR]

Thnx in advnc,
Shabeer…