How to remove Flex IFrame while loading a new module?

Question

I have an application (container) within which modules are loaded using a module loader, when a menu item in the application is clicked. Within one of the modules, I have an iframe which is created and added dynamically when the user clicks on a tree item within that module.

The problem is, when the menu is clicked to load another module, the iframe alone is not getting removed from the parent application and is being displayed (incorrectly) over the new module.

My question is how to remove that iframe from the currently loaded module, just before loading the new module ?

PS: Flex 4 SDK

Answer 1

Say for e.g., Consider this is the IFrame instance I have created which is inside a border container.

<s:BorderContainer id="mybordercontainer" right="0"  top="0"  left="5" bottom="0" width="100%" height="100%">
    <flexiframe:IFrame id="googleIFrame"
                               label="Google"
                               source="http://www.google.com"
                               width="80%"
                               height="80%"/>
</s:BorderContainer>

for some reason, the following code didn't work.

(mybordercontainer.getElementAt(0) as IFrame).removeIFrame();

Instead, I directly called the removeIFrame() method using the IFrame instance which works well.

googleIFrame.removeIFrame();