Flex3: Component Declarations are Not Allowed Here error

I'm getting the "Compone开发者_StackOverflow中文版nt declarations are not allowed here error" where I've got my RadioButtonGroup. Below is the custom component.

Why can't I put a RadioButtonGroup in it?

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
    <![CDATA[

        import mx.controls.RadioButton;
        import mx.controls.RadioButtonGroup;


        public function removeMe(event:MouseEvent):void  {
            this.removeChild(event.currentTarget as DisplayObject);

        }
    ]]>
</mx:Script>

    <mx:Panel width="500" height="400"  title="hello"  click="removeMe(event)">


        <mx:Text  text="My Text" />

        <mx:RadioButtonGroup>
            <mx:RadioButton label="A"/>
            <mx:RadioButton label="B"/>
            <mx:RadioButton label="C"/>
        </mx:RadioButtonGroup>


    </mx:Panel>
</mx:Canvas>

Any advice on how to solve this problem. I'm using Flex 3, SDK 3.2.

Thank you.

-Laxmidi

A RadioButtonGroup is not a container and therefore cannot have Children in the manner you're setting it up. Add a RadioButton to a group using the groupName property on the RadioButton instance. Like this:

    <mx:RadioButtonGroup id="rbg" />
    <mx:RadioButton label="A" groupName="rbg"/>
    <mx:RadioButton label="B" groupName="rbg"/>
    <mx:RadioButton label="C" groupName="rbg"/>