How to dynamically duplicate an item on the stage

Question

Hello,
I have a box (lets call it 'xBox') on the stage that contains
a couple comboboxes and buttons.
One of the buttons (labelled 'add new search feature') when
clicked will duplicate the whole box 'xbox' and give it a new
unique name that can be referenced. So, now there would be two
boxes on the stage that look exactly the same.
You can click the 'add new search feature' button repeatedly
and each time a new 'xbox' will appear at the bottom below the
previously created 'xbox's....
I have played with states some, but am unsure how that would
apply to an infinite amount of new 'xbox's being created.
Is this possible? Any help is greatly appreciated.
here is the code:
<mx:Box direction="horizontal" borderStyle="solid"
paddingTop="10" paddingBottom="10" paddingLeft="10"
paddingRight="10">
<mx:ComboBox id="xField" width="100%">
<!-- An inline data provider -->
<mx:Array>
<mx:Object data="0" label="Yards gained" />
<mx:Object data="1" label="Shotgun" />
<mx:Object data="2" label="TD" />
<mx:Object data="3" label="Down" />
<mx:Object data="4" label="Leading" />
<mx:Object data="5" label="Quarter" />
<mx:Object data="6" label="Turf/grass" />
<mx:Object data="7" label="Stadium type" />
<mx:Object data="8" label="Home" />
<mx:Object data="9" label="Opponent" />
<mx:Object data="10" label="Month" />
<mx:Object data="11" label="Season" />
</mx:Array>
</mx:ComboBox>
<mx:ComboBox id="argument" width="100%">
<!-- An inline data provider -->
<mx:Array>
<mx:Object data="0" label="Equals" />
<mx:Object data="1" label="is greater" />
<mx:Object data="2" label="is less" />
<mx:Object data="3" label="is not" />
</mx:Array>
</mx:ComboBox>
<mx:TextInput id="enter_data"/>
<mx:Button label="Search"/>
<mx:Button label="Add new Search Feature"/>
</mx:Box>

Answer 1

Okay, what you want to do is, make a custom component out of
the xBox. Then in your main application you wan to make an array of
objects. Every time the button (to add xBoxes) is clicked add one
to the array, then also add it to the main app's list of children.
You want to add it to the array so that you can still reference it.
Try something like this:
import xBox;
import mx.collections.ArrayCollection;
private var xBoxArray : ArrayCollection = new
ArrayCollection();
private var location : int = 1;
private function buttonClickHandler() : void
var temp : xBox = new xBox ();
xBoxArray.addItemAt ( location, temp );
whereYouWantTheXBoxesToGo.addChildAt ( location,
xBoxArray.getItemAt ( location ) );
<mx:Button click="buttonClickHandler()"
label="More xBoxes" id="360" />
<mx:Box id="whereYouWantTheXBoxesToGo"/>
<!--
-->
This is just a rough guide of what to try. But something like
this should work.