How to remove an HBox by clicking a button

[Zunskigraphics]

Ok.. Here is the deal....

I have a button...

when you click this button, i want it to remove an HBox and everything inside it..

I thought by giving my HBox an ID, i could say removeChild(idnamehere); but thats not working.. I really need help on this.. not wrapping around the cranium that well! :o

Here is my code.. (it doesn't work)


<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">

<mx:Script>
<![CDATA[

import flash.events.Event;

private function removeTest():void
{
addEventListener(MouseEvent.CLICK, removeHbox);
}

private function removeHbox(event:Event):void
{
removeChild.id(myHeadache);
}

]]>
</mx:Script>

<mx:Button id="myBtn" x="34" y="27" label="Click to Remove"/>

<mx:HBox id="myHeadache" x="34" y="57" width="321" height="150" backgroundColor="#804040">

<mx:BarChart id="barchart1" width="292" height="132">
<mx:series>
<mx:BarSeries displayName="Series 1" xField=""/>
</mx:series>
</mx:BarChart>

<mx:Legend dataProvider="{barchart1}"/>

</mx:HBox>

</mx:Application>

[Zunskigraphics]

ok.. looks as though my addEventListener is not being fired... not sure why.. but..

I added a "click" event to the button... and now wallla! it works.




<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">

<mx:Script>
<![CDATA[

import flash.events.Event;
import mx.controls.Alert;

private function removeHbox(event:Event):void
{
Alert.show("Hello");
removeChild(myHeadache);
}

]]>
</mx:Script>

<mx:Button id="myBtn" x="34" y="27" label="Click to Remove" click="removeHbox(event)"/>

<mx:HBox id="myHeadache" x="34" y="57" width="321" height="150" backgroundColor="#804040">

<mx:BarChart id="barchart1" width="292" height="132">
<mx:series>
<mx:BarSeries displayName="Series 1" xField=""/>
</mx:series>
</mx:BarChart>

<mx:Legend dataProvider="{barchart1}"/>

</mx:HBox>

</mx:Application>

[NOCer]

ok a few things if you really really want to add your listener in AS

your addEventListener was never getting called. notice the applicationComplete="removeTest()", now after everything is rendered we add the listener.




<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" applicationComplete="removeTest()">

<mx:Script>
<![CDATA[

import flash.events.Event;


private function removeTest():void
{
addEventListener(MouseEvent.CLICK, removeHbox);
}

private function removeHbox(event:Event):void
{
removeChild(myHeadache);
}

]]>
</mx:Script>

<mx:Button id="myBtn" x="34" y="27" label="Click to Remove"/>

<mx:HBox id="myHeadache" x="34" y="57" width="321" height="150" backgroundColor="#804040">

<mx:BarChart id="barchart1" width="292" height="132">
<mx:series>
<mx:BarSeries displayName="Series 1" xField=""/>
</mx:series>
</mx:BarChart>

<mx:Legend dataProvider="{barchart1}"/>

</mx:HBox>

</mx:Application>

[Zunskigraphics]

Ahhh, can't believe I didn't catch that.. thanks.