Flex Components and main.mxml communication

Question

I'm building a Flex 4 Application in AIR.

I've made a main.mxml and a login.mxml component. It all works but i can't communicate between my two mxmls (MAIN and COMPONENT)

The login works but then it has to send a event tot the main that i can change the state in the main.

Here is my cropped code.

login.mxml

//resulthandler if login is succesfull
                loginUserResult.addEventListener(ResultEvent.RESULT, loginUserResultHandler);

        public function loginUserResultHandler(event:ResultEvent):void
        {
            if(loginUserResult.lastResult == 1)
            {
                dispatchEvent(new Event('myLoginSuccesfull'));
                trace("dispatchEvent - myLoginSuccesfull ");
            }
            else
            {
                this.loginErrorLBL.text = "Username and/or password aren't valid.";
            }
        }

So the login.mxml sends the event succesfully.

main.mxml

    <fx:Script>
    <![CDATA[
        import mx.events.FlexEvent;

        protected function windowedapplication1_initializeHandler(event:FlexEvent):void
        {
            loginInstanceCom.addEventListener('myLoginSuccesfull', onLoginSuccesful);
        }

        protected function onLoginSuccesful(event:Event):void{
            trace("onLoginSuccesful recived");
            currentState = "main";
        }
    ]]>
</fx:Script>
</fx:Script>
<s:states>
    <s:State name="State1"/>
    <s:State name="main"/>
</s:states>

<components:login id="loginInstanceCom" x="263" y="10" width="239" height="223" includeIn="State1">
</components:login>

So, the instance from the component loginInstanceCom isn't recognized in the windowedapplication initialize where i use the same id.

It gives the following error:

TypeError: Error #1009: Cannot access a property or method of a null object reference.

Hopefully someone can help me. Thanx!

can't you just use a view stack instead of states? States are so ugly in flex in my opinion. — Adrian Pirvulescu

JeffryHouser JeffryHouser · Accepted Answer · 2012-03-07T14:32:37

Although you didn't specify, I am assuming that the login.mxml component is a child of the main.mxml component.

To dispatch an event, do this:

dispatchEvent(new Event('myLoginSuccesful'));

You may want to add metadata to the component to have that event show up in code hinting, but it is not required.

Listen for the event in your main application:

loginInstance.addEventListener('myLoginSuccesful',onLoginSuccesful);

I would probably add this code in the initialize handler of the main component.

In your handler method, just change the state:

protected function onLoginSuccesful(event:Event):void{
 currentState = 'main';
}

Flex Components and main.mxml communication

2 Answers