3 Replies Latest reply on Aug 26, 2008 10:10 PM by Ratsnackbar

    Programatically access a RadioButtonGroup

    istrasci Level 1
      I know you can call "getChildByName(name)" to access a component (any subclass of DisplayObject) through it's name property. However, RadioButtonGroups are not a subclass of DisplayObject, so how can I programatically get access to them (specifically, so I can clear all buttons (so none are yet chosen, like at startup)?
        • 1. Re: Programatically access a RadioButtonGroup
          Ratsnackbar Level 2
          You can simply set the groups selection parameter to null.
          I took the code for the example from Adobe's Flex Documentation and simply modified it with a button to clear the group.

          <?xml version="1.0"?>
          <!-- controls\button\RBGroupEvent.mxml -->
          <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml">

          <mx:Script>
          <![CDATA[

          import mx.controls.Alert;
          import mx.events.ItemClickEvent;

          private function handleCard(event:ItemClickEvent):void {
          if (event.currentTarget.selectedValue == "AmEx") {
          Alert.show("You selected American Express.");
          } else if (event.currentTarget.selectedValue == "MC") {
          Alert.show("You selected MasterCard.");
          } else {
          Alert.show("You selected Visa.");
          }
          }

          private function clearRadioGroup(event:Event):void{
          this.cardtype.selection = null;
          }
          ]]>
          </mx:Script>

          <mx:RadioButtonGroup id="cardtype" itemClick="handleCard(event);"/>
          <mx:RadioButton groupName="cardtype"
          id="americanExpress"
          value="AmEx"
          label="American Express"
          width="150"/>
          <mx:RadioButton groupName="cardtype"
          id="masterCard"
          value="MC"
          label="MasterCard"
          width="150"/>
          <mx:RadioButton groupName="cardtype"
          id="visa"
          value="Visa"
          label="Visa"
          width="150"/>
          <mx:Button id="clearGroup" label="Clear Group" click="clearRadioGroup(event)"/>
          </mx:Application>
          • 2. Re: Programatically access a RadioButtonGroup
            istrasci Level 1
            You don't understand what I'm saying... I know how to reset the selection by setting it to null... What I'm asking is how to get access to the RadioButtonGroup component programatically... I have a string with the RadioButtonGroup id... Now give me that component... Like this:

            private function(name:String):void
            {
            // a:RadioButtonGroup = give me the RBG whose id is "name"
            a.selection = null
            }

            If I needed access to a component, I can use getChildByName:

            private function(name:String):void
            {
            a:Label = getChildByName(name) as Label;
            a.text = "New label text";
            }

            But you can't use getChildByName for a RadioButtonGroup... So what do I use instead, or how can I get the application to return the RBG to me so I can use it...?
            • 3. Re: Programatically access a RadioButtonGroup
              Ratsnackbar Level 2
              Ah I see what you mean. At least I think I do.
              Try this instead.
              This is basically the same code as before but notice how I use this[MY_RADIO_GROUP] in the trace statement to obtain a reference to the object.

              The only thing I do not like about this is you cannot bind the ID param of the radiobuttongroup to the value of the constant (or variable if you wish). Perhaps there is a way to do that in MXML but if I need to set that value to a variable I tend to do it in ActionScript and not in MXML. You CAN however set the value of the RadioButton.groupName parameters with a Binding if you wish which can come in handy when dynamically generating a radiobutton that can change to a different group based on need.

              So heres the code. Hope this is what you wanted.

              <?xml version="1.0"?>
              <!-- controls\button\RBGroupEvent.mxml -->
              <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml">

              <mx:Script>
              <![CDATA[
              import mx.utils.ObjectUtil;

              import mx.controls.Alert;
              import mx.events.ItemClickEvent;

              static const MY_RADIO_GROUP:String = "myRadioGroup";

              private function handleCard(event:ItemClickEvent):void {
              trace(mx.utils.ObjectUtil.toString(this[MY_RADIO_GROUP]));
              if (event.currentTarget.selectedValue == "AmEx") {
              Alert.show("You selected American Express.");
              } else if (event.currentTarget.selectedValue == "MC") {
              Alert.show("You selected MasterCard.");
              } else {
              Alert.show("You selected Visa.");
              }
              }

              private function clearRadioGroup(event:Event):void{
              this[MY_RADIO_GROUP].selection = null;
              }
              ]]>
              </mx:Script>

              <mx:RadioButtonGroup id="myRadioGroup" itemClick="handleCard(event);"/>
              <mx:RadioButton groupName="{MY_RADIO_GROUP}"
              id="americanExpress"
              value="AmEx"
              label="American Express"
              width="150"/>
              <mx:RadioButton groupName="{MY_RADIO_GROUP}"
              id="masterCard"
              value="MC"
              label="MasterCard"
              width="150"/>
              <mx:RadioButton groupName="{MY_RADIO_GROUP}"
              id="visa"
              value="Visa"
              label="Visa"
              width="150"/>
              <mx:Button id="clearGroup" label="Clear Group" click="clearRadioGroup(event)"/>
              </mx:Application>