<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" initialize="init()">
<mx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.events.DragEvent;
import mx.collections.ArrayCollection;
private var grid1DP:ArrayCollection = new ArrayCollection([
{roleName:"校长"},
{roleName:"班主任"},
{roleName:"任课老师"}
]);
[Bindable]
private var grid2DP:ArrayCollection=new ArrayCollection();
private function init():void{
}
private function doSubmit():void
{
var array1:ArrayCollection=this.grid1DP;
var array2:ArrayCollection=this.grid2DP;
Alert.show("1:"+array1.length+"---"+"2:"+array2.length);
for(var i:int=0 ; i<array1.length ;i++){
Alert.show(array1.getItemAt(i).roleName+"")
}
}
//拖拽移动
private function grid1DragCompleteHandler(event:DragEvent):void
{
grid2DP.addItem(dataGrid1.selectedItem);
this.grid1DP.removeItemAt(this.grid1DP.getItemIndex(dataGrid1.selectedItem));
}
private function grid2DragBeforeHandler(event:DragEvent):void
{
grid1DP.addItem(dataGrid2.selectedItem);
this.grid2DP.removeItemAt(this.grid2DP.getItemIndex(dataGrid2.selectedItem));
}
//双击移动
private function dg1ToDG2():void{
grid2DP.addItem(dataGrid1.selectedItem);
this.grid1DP.removeItemAt(this.grid1DP.getItemIndex(dataGrid1.selectedItem));
}
private function dg2ToDG1():void{
grid1DP.addItem(dataGrid2.selectedItem);
this.grid2DP.removeItemAt(this.grid2DP.getItemIndex(dataGrid2.selectedItem));
}
]]>
</mx:Script>
<mx:Canvas width="100%" height="100%" top="33" bottom="4" >
<mx:Grid id="myForm" width="98%" height="100%" horizontalAlign="center" paddingTop="8" paddingBottom="10" >
<mx:GridRow height="100%">
<mx:GridItem colSpan="2" height="100%" >
<mx:HBox width="100%" height="100%" paddingTop="8" >
<mx:Panel width="100%" height="100%" title="未选择角色">
<mx:DataGrid id="dataGrid1" dataProvider="{grid1DP}" width="100%" height="100%" doubleClickEnabled="true" doubleClick="dg1ToDG2()" dragEnabled="true" dragMoveEnabled="true" dropEnabled="false" dragComplete="grid1DragCompleteHandler(event)">
<mx:columns>
<mx:DataGridColumn dataField="roleName" headerText="角色名称" />
</mx:columns>
</mx:DataGrid>
</mx:Panel>
<mx:Panel width="100%" height="100%" title="已选择角色">
<mx:DataGrid id="dataGrid2" dataProvider="{grid2DP}" width="100%" height="100%" doubleClickEnabled="true" doubleClick="dg2ToDG1()" dragEnabled="true" dragMoveEnabled="true" dropEnabled="false" dragComplete="grid2DragBeforeHandler(event)" >
<mx:columns>
<mx:DataGridColumn dataField="roleName" headerText="角色名称" />
</mx:columns>
</mx:DataGrid>
</mx:Panel>
</mx:HBox>
</mx:GridItem>
</mx:GridRow>
<mx:GridRow>
<mx:GridItem colSpan="2" horizontalAlign="center">
<mx:Button label="确 定" click="doSubmit()"/>
<mx:Button label="取 消" />
</mx:GridItem>
</mx:GridRow>
</mx:Grid>
<mx:Spacer height="5" />
</mx:Canvas>
</mx:Application>
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" initialize="init()">
<mx:Script>
<![CDATA[
import mx.events.DragEvent;
import mx.collections.ArrayCollection;
private var grid1DP:ArrayCollection = new ArrayCollection([
{roleName:"校长"},
{roleName:"班主任"},
{roleName:"任课老师"}
]);
[Bindable]
private var grid2DP:ArrayCollection=new ArrayCollection();
private function init():void{
}
private function grid1DragCompleteHandler(event:DragEvent):void
{
grid2DP=new ArrayCollection();
grid2DP.addItem(dataGrid1.selectedItem);
}
private function dg1ToDG2():void{
if(grid2DP.length>0)
{
grid1DP.addItem(grid2DP.getItemAt(0));
}
grid2DP=new ArrayCollection();
grid2DP.addItem(dataGrid1.selectedItem);
this.grid1DP.removeItemAt(this.grid1DP.getItemIndex(dataGrid1.selectedItem));
}
private function grid2DragBeforeHandler(event:DragEvent):void
{
if(grid2DP.length>0)
{
grid1DP.addItem(grid2DP.getItemAt(0));
}
}
private function dg2ToDG1():void{
if(grid2DP.length>0)
{
grid1DP.addItem(grid2DP.getItemAt(0));
}
this.grid2DP.removeItemAt(0);
}
]]>
</mx:Script>
<mx:Canvas width="100%" height="100%" top="33" bottom="4" >
<mx:Grid id="myForm" width="98%" height="100%" horizontalAlign="center" paddingTop="8" paddingBottom="10" >
<mx:GridRow height="100%">
<mx:GridItem colSpan="2" height="100%" >
<mx:HBox width="100%" height="100%" paddingTop="8" >
<mx:Panel width="100%" height="100%" title="未选择角色">
<mx:DataGrid id="dataGrid1" dataProvider="{grid1DP}" width="100%" height="100%" doubleClickEnabled="true" doubleClick="dg1ToDG2()" dragEnabled="true" dragMoveEnabled="true" dropEnabled="true" dragComplete="grid1DragCompleteHandler(event)">
<mx:columns>
<mx:DataGridColumn dataField="roleName" headerText="角色名称" />
</mx:columns>
</mx:DataGrid>
</mx:Panel>
<mx:Panel width="100%" height="100%" title="已选择角色">
<mx:DataGrid id="dataGrid2" dataProvider="{grid2DP}" width="100%" height="100%" doubleClickEnabled="true" doubleClick="dg2ToDG1()" dragEnabled="true" dragMoveEnabled="true" dropEnabled="true" dragDrop="grid2DragBeforeHandler(event)" >
<mx:columns>
<mx:DataGridColumn dataField="roleName" headerText="角色名称" />
</mx:columns>
</mx:DataGrid>
</mx:Panel>
</mx:HBox>
</mx:GridItem>
</mx:GridRow>
<mx:GridRow>
<mx:GridItem colSpan="2" horizontalAlign="center">
<mx:Button label="确 定"/>
<mx:Button label="取 消" />
</mx:GridItem>
</mx:GridRow>
</mx:Grid>
<mx:Spacer height="5" />
</mx:Canvas>
</mx:Application>