Flex3: Component Declarations are Not Allowed Here error - apache-flex

Question

I'm getting the "Component 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

Answer 1

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"/>