4 Replies Latest reply on Aug 6, 2009 8:06 AM by ice1000

    Changing ViewState yields 'Dispatch Event is not a function'

    ice1000

      In my main application I use an init function to load a login form. I register a listener for the closing of the form. When the close event occurs, I want to change state and load my chart.

       

      The code works perfectly...until I try to add a transition effect from state to state, then I get a 'Dispatch Event is not a function'.

       

      Can some one explain what is going on?

       

      <?xml version="1.0"?>

       

      <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
          xmlns:ad="myComponents.charts.*"
          applicationComplete="showLogin()"
          layout="horizontal">

       

          <!--parent container-->
          <mx:Canvas id="parentCanvas" width="100%" height="100%">
         
          </mx:Canvas>

       

          <mx:Style source="assets/css/styles.css"/>

       

          <mx:states>
              <mx:State name="dashboardOn">
                  <mx:AddChild  relativeTo="{parentCanvas}" position="firstChild">
                      <mx:VBox id="topRow" width="100%" height="100%">
                          <mx:Button id="btnLogout" label="Logout" click="btnLogout_Click(event)"/>   
                      </mx:VBox>           
                  </mx:AddChild>
                 
                  <mx:AddChild relativeTo="{btnLogout}" position="after">
                      <ad:columnChart chartTitle="Net Income By Entity"/>
                  </mx:AddChild>
              </mx:State>
          </mx:states>
         
          <mx:transitions>
              <mx:Transition fromState="*" toState="*">
                  <mx:Parallel
                      target="{Login_Popup}">
                      <mx:Move duration="400"/>
                  </mx:Parallel>
              </mx:Transition>
          </mx:transitions>
         
         
          <mx:Script>
              <![CDATA[
                  import mx.events.CloseEvent;
                  import mx.managers.PopUpManager;
                  import mx.core.IFlexDisplayObject;
                  import myComponents.Login_Popup;
                 
                  [Bindable]
                  public var pop1:Login_Popup;
             
                  private function showLogin():void {
                                              
                      pop1 = Login_Popup(PopUpManager.createPopUp(this, Login_Popup, false));
                     
                      //Set event listeners for popup
                      pop1.addEventListener(CloseEvent.CLOSE,onLoginClose);               
                  }

       

                 
                  private function onLoginClose(event:Event):void {
                      //handle closing of login popup and change state   
                      this.currentState="dashboardOn";
                  }

       

                  private function btnLogout_Click(event:Event):void{
                      //logout
                      ws.Logout();
                      this.currentState='';
                      showLogin();
                  }

       

       
              ]]>
          </mx:Script>

       


          <mx:WebService id="ws" wsdl="http://localhost/WebService/Service1.asmx?WSDL">
                  <mx:operation name="Logout"/>
          </mx:WebService> 

       

      </mx:Application>

        • 1. Re: Changing ViewState yields 'Dispatch Event is not a function'
          Gregory Lafrance Level 6

          Can we see your Login component? Another point is that you are using a Move in your transition, but I don't see anything leading me to believe the Login component is moving, just closing.

           

          Also, because popups are in their own display list under systemManager, I'm wondering if it will respond correctly.

           

          If this post answers your question or helps, please mark it as such.

          1 person found this helpful
          • 2. Re: Changing ViewState yields 'Dispatch Event is not a function'
            ice1000 Level 1

            Sure, here it is. I tried Fade, Dissolve, etc. Move was just the latest try.

             

            <?xml version="1.0"?>
            <mx:TitleWindow
                xmlns:mx="http://www.adobe.com/2006/mxml"
                xmlns:ext="extenders.panel.*">

             

                 <mx:Style>
                     .panelTitle {
                         fontSize: "19";
                     }
                 </mx:Style>

             

                <mx:Panel
                    width="250"
                    height="225"
                    layout="absolute"
                    x="50.5"
                    y="34"
                    title="Login"
                    id="_loginPanel"
                    titleStyleName="panelTitle">
                   
                    <mx:Button id="_submitButton" x="10" y="128" label="Submit"  click="submitButton_Click(event)"/>
                    <mx:TextInput id="_usernameTextInput" x="20" y="37"  editable="true" enabled="true" enter="submitButton_Click(event)"/>
                    <mx:TextInput id="_passwordTextInput" x="20" y="84"  displayAsPassword="true" editable="true" enabled="true" enter="submitButton_Click(event)"/>
                    <mx:Label x="10" id="_usernameLabel" y="20" text="Username:"/>
                    <mx:Label x="10" id="_passwordLabel" y="67" text="Password:"/>
                    <mx:Button x="150" id="_logoutButton" y="128" label="Logout"  click="logoutButton_Click(event)"/>
                </mx:Panel>

             

                <mx:Script>
                    <![CDATA[
                        import mx.managers.PopUpManager;
                        import mx.rpc.events.ResultEvent;
                        import mx.collections.ArrayCollection;
                       
                        [Bindable]
                        public var loginResult:String;
                                                     
                        private function submitButton_Click(event:Event):void {
                            ws.Login(_usernameTextInput.text, _passwordTextInput.text);
                            _statusText.includeInLayout=true;
                            _statusText.text = "Connecting...";
                        }
                       
                        private function logoutButton_Click(event:Event):void {
                            ws.Logout();
                        }
                   
                        //process login and close pop-up
                        private function handleLogin_Result (event:ResultEvent):void {
                        var resultArr:ArrayCollection = event.result as ArrayCollection;
                        var authent:String = resultArr[0];
                       
                         switch (authent)  {
                              case "TRUE":
                                      loginResult = authent;
                                      //dispatch close event
                                      PopUpManager.removePopUp(this);
                                    break;
                                       
                              case "FALSE":
                                      _statusText.includeInLayout=true;
                                    _statusText.text = resultArr[1];
                                    loginResult = authent;
                                    break;                            
                            }
                        }       
                   
                    ]]>
                </mx:Script>

              
                    <!--used to show login error -->
                    <mx:Label x="66" y="242" id="_statusText" enabled="true" includeInLayout="false"/>
               
                    <mx:WebService id="ws" wsdl="http://localhost/webservice/Service1.asmx?WSDL">
                        <mx:operation name="Login" result="handleLogin_Result(event)"/>
                        <mx:operation name="Logout"/>
                    </mx:WebService>
            </mx:TitleWindow>

            • 3. Re: Changing ViewState yields 'Dispatch Event is not a function'
              Gregory Lafrance Level 6

              Still, I'm not seeing anywhere in the component and the app where the Move effect would actually move anything.

               

              Did the Fade and Dissolve effects also give this error?

               

              One other thing, the Parallel has only one effect is it, so maybe it is not necessary?

               

              If this post answers your question or helps, please mark it as such.

              • 4. Re: Changing ViewState yields 'Dispatch Event is not a function'
                ice1000 Level 1

                Fade and Dissolve also give the same error. Changing Parallel to Sequence has no effect.

                 

                The only other items that I'm not sure about are the following:

                 

                    <mx:transitions>
                        <mx:Transition fromState="*" toState="*">
                            <mx:Sequence
                                target="{Login_Popup}">
                                <mx:Dissolve duration="400"/>
                            </mx:Sequence>
                        </mx:Transition>
                    </mx:transitions>

                 

                I'm specifying the name of the mxml component not the pop1 variable as a target. Is this correct?

                 

                In the custom component Login_popup I am doing this:

                 

                PopUpManager.removePopUp(this);

                 

                Would this negate any transitions?

                 

                And finally, is my method of using the popup manager a best practice? Should I just create a base state with the custom component in it and then switch states after login? How are logins usually handled?

                 

                Thanks for all your help so far!