Can you drag and drop within the same list*?

Question

*without completely strange things happening?
It seems like this ought to be fairly straight forward. This
code is taken from the Flex 2 Component Explorer and I've just
added a few Drag and Drop parameters to the list. It doesn't quite
work. The items are duplicated, not selected, selectable. The
behavior is a bit erratic.
It seems very natural to want to be able to re-order a list
using drag and drop so it seems like it should be easy. Obviously,
I could create a second, empty list--but that would take up
valuable screen real estate. I've seen a few posts about this and
none of them were answered so either the solution is obvious
(please share) or it's impossible (please share).
Cheers,
Steve
<?xml version="1.0"?>
<!-- Simple example to demonstrate the List Control -->
<mx:Application xmlns:mx="
http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
[Bindable]
public var selectedItem:Object;
]]>
</mx:Script>
<mx:Model id="mystates">
<states>
<state label="Alabama" data="AL"/>
<state label="Alaska" data="AK"/>
<state label="Arizona" data="AZ"/>
<state label="Arkansas" data="AR"/>
<state label="California" data="CA"/>
<state label="Colorado" data="CO"/>
<state label="Connecticut" data="CT"/>
</states>
</mx:Model>
<mx:Panel title="List Control Example" height="75%"
width="75%"
paddingTop="10" paddingBottom="10" paddingLeft="10"
paddingRight="10">
<mx:Label text="Select a state to see its
abbreviation."/>
<mx:List id="source" width="100%" color="blue"
dataProvider="{mystates.state}"
change="this.selectedItem=List(event.target).selectedItem"
dragEnabled="true"
dropEnabled="true"
dragMoveEnabled="true"/>
<mx:VBox width="100%">
<mx:Label text="Selected State:
{selectedItem.label}"/>
<mx:Label text="State abbreviation:
{selectedItem.data}"/>
</mx:VBox>
</mx:Panel>
</mx:Application>

Answer 1

The answer is, yes you can. However, I'm not sure why this
makes a difference.
I added creationComplete="init();" to the application tag.
<em>Removed the model</em> and implemented this method:
public function init(): void {
source.dataProvider = [
{label: "Alabama", data: "AL"},
{label: "Alaska", data: "AK"},
{label: "Arizona", data: "AZ"},
{label: "California", data: "CA"},
{label: "Colorado", data: "CO"},
{label: "Connecticut", data: "CT"}
and removed the dataProvider attribute from the List tag.
Can anyone tell me why the one works and the other
doesn't?