If you're using a Flex DataGrid with the editable property set to true, the default behaviour of the Tab key is moving from one editable cell to another one while the Enter key move from one row to another one. There isn't any DataGrid option to easily make Enter key behaves like Tab key. And you can't override the KEY_DOWN event handler method of the DataGrid directly. However, you can register your own handler with a higher priority than the default DataGrid handler. By doing this, your handler will be called before DataGrid handler giving you the possibility to customize the action of the pressed keys. That's what we're going to do.
In your own handler you can check if the pressed key is Enter and than simply stop the propagation of the KeyboardEvent. Ok, this disables the default Enter event. But how can we make Enter works as Tab? We can just dispatch a fake KEY_FOCUS_CHANGE event. And that's it! Let's see the code:
public class CustomDataGrid extends DataGrid {
public function CustomDataGrid() {
super();
}
/*
* After Flex register its own handler in the createItemEditor method,
* we register our event listener with a higher priority (100).
*/
override public function createItemEditor(colIndex:int, rowIndex:int):void {
super.createItemEditor(colIndex, rowIndex);
DisplayObject(itemEditorInstance).addEventListener(KeyboardEvent.KEY_DOWN, onEditorKeyDown, false, 100);
}
/*
* If the pressed key is Enter, stop the propagation and
* dispatch a fake Tab Event.
*/
protected function onEditorKeyDown(event:KeyboardEvent):void {
if (event.charCode == Keyboard.ENTER && event.keyCode != 229) {
event.stopImmediatePropagation();
dispatchEvent(new FocusEvent(FocusEvent.KEY_FOCUS_CHANGE, true, false, null, event.shiftKey, Keyboard.TAB));
}
}
}
Be careful with itemRenderers and itemEditors
If you are using a custom itemRenderer or itemEditor, I recommend you to pay attention to the events they dispatch. They can dispatch extra events that make your Enter key not behaves exactly like the Tab key, specially if you're listening to the ITEM_EDIT_END event. It depends on the case, but if you're having problems with this use the same technique to interrupt not convenient events on your itemEditor or itemRenderer.
And that's it!
