Saturday, March 25, 2006

Setting Focus on PopUp Componets

Last week I spent some time trying to set focus on popUp's componets from the parent Window with Macromedia Flex. The idea was very simple, we had a defaultButton property set on a TextInput to automatically display the search results on a PopUp window when user pressed the ENTER key. The result was base on the parameters typed by the user on the TextInput. On the resultWindow(popUp) the result was display using a DataGrid. I wanted to automatically set the focus on the popUp's grid when the popUp was shown, so the user could start navigating the results on the DataGrid using only the keyboard and avoid using the mouse.
I read on the Flex Documentation that it is recommended to use the method setFocus() of the FocusManager instead Selection.setFocus(), I tryed to make it work using the FocusManager but I couldn't make it. I looked for documentation about how to use the FocusManager and I didn't find as many as I expected. At the end the solution was very easy and simple but I took me some time to find it. Here is my solution......

function showResult(){
popUp=mx.managers.PopUpManager.createPopUp(this,window,false,initObj,false);
popUp.centerPopUp(); // Center de PopUp
Selection.setFocus(popUp.resultDg); // set the Focus on the DataGrid
}// end showResult() function


showResult() - Call when the user press ENTER Key, it creates the popUp
popUp - Variable on the Parent Window referencing the popUp Window.
window - Class name of the resultWindow.
initObj - Object that contains initialization properties.
resultDg - DataGrid's ID on the resultWindow(popUp).