如何检查Flex中动态生成的单选按钮和复选框上的用户选择?

时间:2011-01-27 04:58:49

标签: flex actionscript-3 actionscript

以下是我的代码。这仍在进行中;所以,你会看到一些空内容的函数。另外,这是我的第一个Flex应用程序;请耐心等待。

这是一个测验应用程序,可以从ColdFusion Web服务获取每个问题的问题和答案。有三种类型的问题,真或假,多选和单选,以及多选有多种选择。因此,基于问题类型,应用程序将动态生成适当数量的单选按钮或复选框供用户选择。我得到了这些工作。我遇到的问题是,我不知道如何检查用户实际选择的内容。在其他一些论坛和其他网站上的帖子中,它说我可以使用event.currentTarget.selectedValue来获取用户选择。但是当我真正这样做时,我得到一个运行时错误,说“在mx.controls.FormItem上找不到属性selectedValue,并且没有默认值。”我的问题是,我需要做些什么来捕获用户选择?

提前致谢,

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
  xmlns:s="library://ns.adobe.com/flex/spark" 
  xmlns:mx="library://ns.adobe.com/flex/mx"
  creationComplete="initVars()">
    <fx:Declarations>       
      <s:RemoteObject id="CFCertService" destination="ColdFusion" source="CFCertExam.cfquiz">
        <s:method name="returnQuestions" result="resultHandler(event)"/>
        <s:method name="returnAnswers" result="answerHandler(event)"/>
      </s:RemoteObject>
    </fx:Declarations>
    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import mx.containers.FormItem;
            import mx.controls.Alert;
            import mx.controls.CheckBox;
            import mx.controls.RadioButton;
            import mx.rpc.events.ResultEvent;
            import mx.rpc.remoting.RemoteObject;

            [Bindable]
            private var questionArray:ArrayCollection;
            private var questionType:String;
            private var answerItem:FormItem;

            [Bindable]
            private var currentQuestionCounter:int;

            [Bindable]
            private var answerArray:ArrayCollection;
            private var myOptionButton:RadioButton = new RadioButton();
            private var myOptionButton2:RadioButton = new RadioButton();

            private function initVars():void {
                currentQuestionCounter = 0;
                btnPrev.enabled = false;
                btnNext.enabled = false;
            }

            private function answerHandler(event:ResultEvent):void {
                answerArray = event.result as ArrayCollection;
                var i:int;
                answerForm.removeAllChildren();
                answerItem = new FormItem();
                answerForm.addChild(answerItem);

                switch (questionType) {
                    case "True or False":
                    {   
                            myOptionButton.label = "True";
                            if (answerArray.getItemAt(0).Answer_Choice == "True") {
                              myOptionButton.value = 1;
                            } else {
                                myOptionButton.value = 0;
                            }


                            answerItem.addChild(myOptionButton);                            

                            myOptionButton2.label = "False";             
                            if (answerArray.getItemAt(0).Answer_Choice == "False") {
                                myOptionButton2.value = 1;
                            } else {
                                myOptionButton2.value = 0;
                            }
                            answerItem.addChild(myOptionButton2);                       
                            answerItem.addEventListener(MouseEvent.CLICK, selectionHandler);                            
                            break;
                    }

                    case "Multiple Choice (Single Selection)":
                    {
                        for (i=0; i<answerArray.length; i++) {
                            var myOptionButton1:RadioButton = new RadioButton();
                            myOptionButton1.label = answerArray.getItemAt(i).Answer_Choice; 
                            if (answerArray.getItemAt(i).Corect_Flag == "1") {
                                myOptionButton1.value = 1;
                            } else {
                                myOptionButton1.value = 0;
                            }                           
                            answerItem.addChild(myOptionButton1);                           
                        }
                        break;
                    }

                    case "Multiple Choice (Multiple Selection)":
                    {
                        for (i=0; i<answerArray.length; i++) {
                            var myCheckBox:CheckBox = new CheckBox();
                            myCheckBox.label = answerArray.getItemAt(i).Answer_Choice;             
                            answerItem.addChild(myCheckBox);                            
                        }
                        break;
                    }
                }

                answerForm.x = 380;
                answerForm.y = 200;
            }

            private function selectionHandler(event:MouseEvent):void {
                Alert.show(event.currentTarget.toString());
            }

            private function resultHandler(event:ResultEvent):void {
                questionArray = event.result as ArrayCollection;

                txt1Questions.htmlText = questionArray.getItemAt(currentQuestionCounter).Question_Text;
                questionType = questionArray.getItemAt(currentQuestionCounter).Question_Type;
                btnNext.enabled = true;
                CFCertService.returnAnswers(questionArray.getItemAt(currentQuestionCounter).Question_ID);
            }

            private function buttonEventHandler():void {
                CFCertService.returnQuestions();
                btnStartExam.enabled = false;
            }

            private function btnPrevEventHandler():void {
                currentQuestionCounter--;
                if (currentQuestionCounter == 0) {
                    btnPrev.enabled = false;
                }
                if (currentQuestionCounter < questionArray.length) {
                    btnNext.enabled = true;
                }
                txt1Questions.htmlText = questionArray.getItemAt(currentQuestionCounter).Question_Text;
                questionType = questionArray.getItemAt(currentQuestionCounter).Question_Type;
                CFCertService.returnAnswers(questionArray.getItemAt(currentQuestionCounter).Question_ID);

            }

            private function answerReturnHandler(questionIndex:int):void {
            }

            private function btnNextEventHandler():void {
                currentQuestionCounter++; 

                if (currentQuestionCounter > 0) {
                    btnPrev.enabled = true;
                }
                if (currentQuestionCounter >= (questionArray.length - 1)) {
                    btnNext.enabled = false;
                }
                txt1Questions.htmlText = questionArray.getItemAt(currentQuestionCounter).Question_Text;
                questionType = questionArray.getItemAt(currentQuestionCounter).Question_Type;
                CFCertService.returnAnswers(questionArray.getItemAt(currentQuestionCounter).Question_ID);

            }
        ]]>
    </fx:Script>

    <mx:Text id="txt1Questions" x="129" y="124"/>
    <s:Button id="btnStartExam" label="Start Exam" click="buttonEventHandler()" x="370" y="54"/>

    <mx:Form id="answerForm"/>
    <s:Button x="129" y="436" label="Previous" id="btnPrev" click="btnPrevEventHandler()" enabled="false"/>
    <s:Button x="642" y="436" label="Next" id="btnNext" click="btnNextEventHandler()" enabled="false"/>

</s:Application>

1 个答案:

答案 0 :(得分:1)

代码中的问题是currentTarget引用了你添加事件监听器的UIComponent,你添加到FormItem而不是RadioButtons。

两个选项

  1. 如果要继续将事件侦听器添加到FormItem,则应使用target而不是currentTarget来获取对单击的实际项目的引用,而不是使用selectionHandler的UIComponent听众就可以了。但是,您应该知道,如果您向FormItem添加任何其他内容(例如,Labels,RichText等),那些项目也会在单击时触发事件侦听器。

  2. 另一个选项是向每个RadioButtons添加事件侦听器(它们都可以使用currentTarget),然后selectionHandler将正常工作。

  3. 此外,您可能希望对仅允许单个选择的问题使用RadioButtonGroup。然后你只需要使用RadioButtonGroup上的Event.CHANGE来触发你的{{1}}。

    其他资源

    从一周中的Flex系列中查看video on event bubbling