Adobe Flex form losses focus so default button doesn't work
===

I have a form that looks like the following:

    <mx:HBox width="100%" horizontalAlign="center" verticalAlign="middle">
    		<mx:Panel horizontalAlign="center"
    				  title="{resourceManager.getString('Resources','views.login.title')}"
    				  verticalAlign="middle">
    			<mx:Form id="loginForm" defaultButton="{loginButton}">
    				<mx:FormItem label="{resourceManager.getString('Resources','views.login.ip')}">
    					<mx:Label id="url" text="{url}"/>
    				</mx:FormItem>
    				<mx:FormItem label="{resourceManager.getString('Resources','views.login.username')}"
    							 required="true">
    					<mx:TextInput id="username"/>
    				</mx:FormItem>
    				<mx:FormItem label="{resourceManager.getString('Resources','views.login.password')}"
    							 required="true">
    					<mx:TextInput id="password" displayAsPassword="true"/>
    				</mx:FormItem>
    			</mx:Form>
    			<mx:FormItem  direction="horizontal" width="100%" horizontalAlign="right" paddingBottom="2" paddingRight="2">
    				<mx:Button id="loginButton"
    						   label="{resourceManager.getString('Resources','views.login.loginBtn')}"/>
    			</mx:FormItem>
    		</mx:Panel>
    	</mx:HBox>

The behavior I experince some times (not always) is when I tab from username to password and then try to hit "Enter" the Botton's click callback does not get called. If I click on the label (id is "url") then go into any of the textboxes, "Enter" key works just fine. I am assuming that the form somehow keep loosing focus. I would appreciate any idea about solving this problem. 