Unable to retrieve property in main from child popup using event in FlashBuilder

Question

I am using a component to display the popup and using an event listener to get popover properties and remove the popup in the Parent. The poup var, however, in the listeners popup var is nul so it throws an error.

Any suggestions would be greatly appreciated.

John

---

Here is my EditStudentLogInForm.mxml component..

<?xml version="1.0"?>
<!-- containers\layouts\myComponents\MyLoginForm.mxml -->
<mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml"
            creationComplete="handleCreationComplete();">
    <mx:Script>
        <![CDATA[
            import mx.managers.PopUpManager;
            [Bindable] public var studentLoginEmail:String;
        ]]>
    </mx:Script>

    <mx:Form width="333">
        <mx:FormItem label="Email">
            <mx:TextInput id="username" width="207"/>
        </mx:FormItem> 
        <mx:FormItem label="Password">
            <mx:TextInput id="password" 
                      width="205"/>
        </mx:FormItem> 
    </mx:Form>
    <mx:HBox> 
        <mx:Button id="okButton" label="OK"/> 
        <mx:Button id="cancelButton" label="Cancel" />
    </mx:HBox> 
 </mx:TitleWindow>

Here is the Parent...

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
            xmlns:s="library://ns.adobe.com/flex/spark">    
    <mx:Script>
        <![CDATA[
            import flash.events.Event;
            import mx.managers.PopUpManager;
            import mx.core.IFlexDisplayObject;
            import EditStudentLogInForm;
            import mx.containers.TitleWindow;

            public var helpWindow:EditStudentLogInForm;

            public function showLogin():void {
                    // Create the TitleWindow container.
                var helpWindow:EditStudentLogInForm = EditStudentLogInForm(
                    PopUpManager.createPopUp(this, EditStudentLogInForm, true));

                helpWindow.username.text = "johnbdh@myserver.com";
                helpWindow["cancelButton"].addEventListener("click", removeMe);   
                helpWindow["okButton"].addEventListener("click", submitData); 
            }

            // OK button click event listener.
            private function submitData(event:Event):void {
                testText.text = helpWindow.username.text;
                                //*********helpWindow is nul*******
                removeMe(event);
            }

            // Cancel button click event listener.
            private function removeMe(event:Event):void {
                PopUpManager.removePopUp(helpWindow);
            }                           
        ]]>
    </mx:Script>    
</mx:Application>

Answer 1

When you do

public function showLogin():void {
    var helpWindow:EditStudentLogInForm = ...
}

you're declaring and instantiating a new variable helpWindow inside the scope of the showLogin method. This means that the instance you assigned to this locally scoped variable can not be accessed outside the showLogin method.

You did declare another variable helpWindow on the class scope (your class being the main application in this case), but you're never assigning any instance to it (since you're assigning this popup instance to the helpWindow variable that lives only in showLogin.

Hence when you try to access this variable in another method, it's value is null.
The solution is simple enough: just assign the popup instance to the class-scoped variable:

public function showLogin():void {
    helpWindow = EditStudentLogInForm(
        PopUpManager.createPopUp(this, EditStudentLogInForm, true)
    );
    ...
}

---

On a side note: if you have a variable of the same name on the class and inside a method, the most locally scoped one always takes precedence:

public var s:String = 'class';

public function myMethod():void {
    var s:String = 'method';
    trace(s);      // prints method
    trace(this.s); // prints class
}

public function myOtherMethod():void {
    trace(s);      // prints class
    trace(this.s); // prints class
}