Can't get transitions to execute

Question

Hi folks,
I'm building my first Flex app, which is a typical simple quiz. Intro state, string of questions, then a result.
I'm stuck right now in that my transitions are not running. I suspect it has something to do with the fact that I extended the Application class and typed my main application mxml file to that class so that I could keep Actionscript separate from MXML in two separate files. The app will switch states successfully but it won't run the transition effects on a state change, and so my endEffect event is not firing...
It may be that I have something else wrong altogether.
Here is the application MXML file:
<?xml version="1.0" encoding="utf-8"?>
<classes:QuizApplication
    xmlns:local="*"
    xmlns:mx="http://www.adobe.com/2006/mxml"
    xmlns:classes="classes.*"
    layout="absolute"
    currentState="landingState"
    >
    <mx:HTTPService id="questions" url="./data/questions.xml" />
    <classes:states>
        <mx:State name="landingState"/>
        <mx:State name="landingStateOut" basedOn="landingState"/>
        <mx:State name="question">
            <mx:RemoveChild target="{text1}"/>
            <mx:RemoveChild target="{startButton}"/>
            <mx:AddChild relativeTo="{vbox1}" position="lastChild">
                <local:FormHolderVBox id="formHolder" applicationVO="{applicationVO}" width="348" height="248" />
            </mx:AddChild>
        </mx:State>
        <mx:State name="resultState"/>
        <mx:State name="betweenQuestions1" basedOn="question">
            <mx:RemoveChild target="{formHolder}"/>
            <mx:RemoveChild target="{vbox1}"/>
        </mx:State>
    </classes:states>
    <classes:transitions>
        <mx:Transition id="advanceTransition0" fromState="landingState" toState="landingStateOut">
            <mx:Fade
                duration="2000"
                id="fadeToBetween"
                alphaFrom="1"
                alphaTo="0"
                effectEnd="continueAdvance();"
            />    
        </mx:Transition>        
        <mx:Transition id="advanceTransition1" fromState="question" toState="betweenQuestions" effect="{fadeToBetween}" />        
        <mx:Transition id="advanceTransition2" fromState="question" toState="betweenQuestions">
            <mx:Fade
                id="fadeToQuestion"
                alphaFrom="0"
                alphaTo="1"
            />    
        </mx:Transition>        
    </classes:transitions>
    <mx:Canvas x="45" y="41" width="392" height="361" id="canvas">
        <mx:VBox x="21" y="47" height="291" width="348" id="vbox1">
            <mx:Text text="Take this quick quiz to find out what type of shopper you are!" width="347" height="40" fontSize="12" id="text1"/>
            <mx:Button label="Start the Quiz" id="startButton"/>
        </mx:VBox>
    </mx:Canvas>
    <mx:Text text="What kind of shopper are you?"  fontSize="21" fontWeight="bold" fontFamily="Arial" x="45" y="41"/>
</classes:QuizApplication>
And here is the associated Actionscript:
package classes
    import classes.events.AdvanceEvent;
    import flash.events.MouseEvent;
    import mx.collections.ArrayCollection;
    import mx.containers.Canvas;
    import mx.controls.Button;
    import mx.core.Application;
    import mx.events.FlexEvent;
    import mx.events.EffectEvent;
    import mx.rpc.events.ResultEvent;
    import mx.rpc.http.mxml.HTTPService;
    public class QuizApplication extends Application
        [Bindable]
        public var startButton:Button;
        public var canvas:Canvas;
        public var questions:HTTPService;
        //[Bindable] ?
        public var questionVOs:ArrayCollection;
        [Bindable]
        public var applicationVO:ApplicationVO;
        //CONSTRUCTOR
        public function QuizApplication()
            super();
            this.addEventListener(FlexEvent.APPLICATION_COMPLETE, init);
            // go ahead and create singleton of DataClass to store globals
            applicationVO = new ApplicationVO();
        //METHODS
        private function init(e:FlexEvent):void
            startButton.addEventListener(MouseEvent.MOUSE_UP, handleStartQuiz);
            questions.addEventListener(ResultEvent.RESULT, handleQuestionData);
            questions.send();
            // set up listeners for app business
            canvas.addEventListener(AdvanceEvent.FORWARD, advanceToQuestion);
            //canvas.addEventListener(AdvanceEvent.BACKWARD, advanceToQuestion);
        //    canvas.addEventListener(AdvanceEvent.CONTINUE, continueAdvance);
            // set to start with question 1
            applicationVO.currentQuestion = 0;
        // EVENT HANDLERS
        private function handleStartQuiz(e:MouseEvent): void
        //currentState = "question"; // states hard-coded in mxml
        trace("should set state to landingStateOut");
        trace("currentState now is "+currentState);
        currentState = "landingStateOut";
        trace("currentState now is "+currentState);        
        private function handleQuestionData(e:ResultEvent): void
            applicationVO.questionVOs = new ArrayCollection();
            // loop through XML's ArrayCollections and create an ArrayCollection of QuestionVO's, one for each question in XML
             for each (var question:Object in e.result.questions.question)
                var newVO:QuestionVO = new QuestionVO();
                newVO.questionID = question.id;
            //    trace("question.id is "+question.id);
                newVO.questionText = question.text;
            //    trace("question.text is "+question.text);
                newVO.answers = new ArrayCollection();
                for each (var answer:Object in question.answers.answer)
                    newVO.answers.addItem(answer);
                //    trace("answer is "+answer);
                applicationVO.questionVOs.addItem(newVO);
        private function advanceToQuestion(e:AdvanceEvent):void
            trace("should transition to next question now");
            e.stopImmediatePropagation();    
            if (e.type == "forward")
                //somehow call the transition AdvanceTransition
                applicationVO.currentQuestion++;
                currentState = "betweenQuestions1";
            else
                applicationVO.currentQuestion--;
                currentState = "betweenQuestions1";
        public function continueAdvance():void
            trace("should transition now from betweenQuestions2 to question state");
            //currentState = "question";
Can anyone point out what I've got wrong that could cause the Transitions not to work? I thought they were simply supposed to execute on a state change from A to B, for which you've indicated set up a Transition from state A to B.
Many thanks!

Answer 1

Ok, I finally figured out what was wrong.  I was missing the concept that you had to specify a target element in the effect definition in your transition upon which the transition would play.  Transition plays now.