View Application View Source

I’ve ran into a few situations where I’ve needed to control form focus in flex… as well as the default button control… this is done soo very simply in flex.

Usually with my component I have a creationComplete=”init()” and that executes the following code

*NOTE: to manage the default button, one way is to add a tag defaultButton=”{submit}” ** you must have a button with the id of “submit…


var submit:Button = new Button();

private function init():void{
private function resetFocus():void{

First thing is, you must have a form field named userName if you try and use the code that I just posted. The most important part of the excerpt is the “focusManager”.

This is an instance of the mx.managers.IFocusManager Interface. Any component that controls focus, must implement the mx.managers.IFocusManagerComponent. This also manages the concept of defaultButton. You might have thought you would have to have to import the FocusManager class… but nope… in your container components your good to go… just call focusManager.setFocus(formFieldID);

If you view the application, (listed at top on bottom of this blog post) you’ll be able to get a better idea, of the real code. It’s not entirely different, but shows it in full.

You might also notice that when you start the window, you will notice your form field has focus, (focus is shown by default with a colored outline around the component receiving focus), but you may ask, “why don’t I have cursor access?” I asked the same very thing… I haven’t quite proven this to a science of what is happening, all i know is that the flash player doesnt have focus when the browser starts… or a page loads… there is some javascript out there for the IE activation problems, but I didn’t intend on quite getting into this here… just know that if you click on the flash app, then click the resetFocus button you will notice, that the cursor is then available.

View Application View Source