When you use the default item editor in a list-based control, you can edit the cell value, and then press the Enter key to move focus to the next cell in the control. When you create a simple item editor that contains only a single component, and that component implements the IFocusable interface, the item editor also responds to the Enter key. The following components implement the IFocusable interface: Accordion, Button, ButtonBar, ComboBase, DateChooser, DateField, ListBase, MenuBar, NumericStepper, TabNavigator, TextArea, and TextInput.

In the following example, you define a complex item renderer with a VBox container as the top-level component and a CheckBox control as its child component:

<?xml version="1.0"?>
<!-- itemRenderers\dataGrid\myComponents\EditorDGCheckBox.mxml -->
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" 
     backgroundColor="yellow">

    <mx:Script>
        <![CDATA[
            // Define a property for returning the new value to the cell.
            public var cbSelected:Boolean;            
        ]]>
    </mx:Script>
   
    <mx:CheckBox id="followUpCB" label="Follow up needed" 
        height="100%" width="100%" 
        selected="{data.FollowUp}" 
        click="cbSelected=followUpCB.selected" 
        updateComplete="cbSelected=followUpCB.selected;"/>
</mx:VBox>

When this item editor opens, the CheckBox control can obtain focus for editing, but pressing the Enter key does not move focus to the next cell because the parent VBox container does not implement the IFocusManagerComponent interface. You can modify this example to implement the IFocusManagerComponent interface, as the following code shows:

<?xml version="1.0"?>
<!-- itemRenderers\dataGrid\myComponents\EditorDGCheckBoxFocusable.mxml -->
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" 
     backgroundColor="yellow" 
     implements="mx.managers.IFocusManagerComponent" >

    <mx:Script>
        <![CDATA[
            // Define a property for returning the new value to the cell.
            public var cbSelected:Boolean;
            
            // Implement the drawFocus() method for the VBox.
            override public function drawFocus(isFocused:Boolean):void {
                // This method can be empty, or you can use it 
                // to make a visual change to the component.
            }
        ]]>
    </mx:Script>
   
    <mx:CheckBox id="followUpCB" 
        label="Follow up needed" 
        height="100%" width="100%" 
        selected="{data.FollowUp}" 
        click="cbSelected=followUpCB.selected" 
        updateComplete="cbSelected=followUpCB.selected;"/>
</mx:VBox>

While the IFocusManagerComponent interface defines several properties and methods, the UIComponent class defines or inherits implementations for all of them except for the drawFocus() method. Therefore, you only have to implement that one method so that your item editor responds to the Enter key.