Dragging rows between two different Flex DataGrid controls
The following example shows how you can use the dragEnabled, dropEnabled, and dragMoveEnabled properties with the Flex DataGrid control to copy and move rows between different data grids.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="horizontal"
verticalAlign="middle"
backgroundColor="white">
<mx:Array id="arr">
<mx:Object colA="Item A.0" colB="Item B.0" colC="Item C.0" />
<mx:Object colA="Item A.1" colB="Item B.1" colC="Item C.1" />
<mx:Object colA="Item A.2" colB="Item B.2" colC="Item C.2" />
<mx:Object colA="Item A.3" colB="Item B.3" colC="Item C.3" />
<mx:Object colA="Item A.4" colB="Item B.4" colC="Item C.4" />
<mx:Object colA="Item A.5" colB="Item B.5" colC="Item C.5" />
<mx:Object colA="Item A.6" colB="Item B.6" colC="Item C.6" />
<mx:Object colA="Item A.7" colB="Item B.7" colC="Item C.7" />
<mx:Object colA="Item A.8" colB="Item B.8" colC="Item C.8" />
<mx:Object colA="Item A.9" colB="Item B.9" colC="Item C.9" />
</mx:Array>
<mx:ApplicationControlBar dock="true">
<mx:Form>
<mx:FormItem label="DataGrid #1:"
direction="horizontal">
<mx:CheckBox id="dg1_dragEnabled"
label="dragEnabled" />
<mx:CheckBox id="dg1_dropEnabled"
label="dropEnabled" />
<mx:CheckBox id="dg1_dragMoveEnabled"
label="dragMoveEnabled" />
</mx:FormItem>
<mx:FormItem label="DataGrid #2:"
direction="horizontal">
<mx:CheckBox id="dg2_dragEnabled"
label="dragEnabled" />
<mx:CheckBox id="dg2_dropEnabled"
label="dropEnabled" />
<mx:CheckBox id="dg2_dragMoveEnabled"
label="dragMoveEnabled" />
</mx:FormItem>
</mx:Form>
</mx:ApplicationControlBar>
<mx:VBox width="50%">
<mx:Label text="DataGrid #1" />
<mx:DataGrid id="dataGrid1"
width="100%"
rowHeight="22"
dataProvider="{arr}"
dragEnabled="{dg1_dragEnabled.selected}"
dragMoveEnabled="{dg1_dragMoveEnabled.selected}"
dropEnabled="{dg1_dropEnabled.selected}"
verticalScrollPolicy="on">
<mx:columns>
<mx:DataGridColumn dataField="colA"
headerText="Column A" />
<mx:DataGridColumn dataField="colB"
headerText="Column B" />
<mx:DataGridColumn dataField="colC"
headerText="Column C" />
</mx:columns>
</mx:DataGrid>
<mx:Label text="{dataGrid1.dataProvider.length} items" />
</mx:VBox>
<mx:VBox width="50%">
<mx:Label text="DataGrid #2" />
<mx:DataGrid id="dataGrid2"
width="100%"
rowHeight="22"
dataProvider="[]"
dragEnabled="{dg2_dragEnabled.selected}"
dragMoveEnabled="{dg2_dragMoveEnabled.selected}"
dropEnabled="{dg2_dropEnabled.selected}"
verticalScrollPolicy="on">
<mx:columns>
<mx:DataGridColumn dataField="colA"
headerText="Column A" />
<mx:DataGridColumn dataField="colB"
headerText="Column B" />
<mx:DataGridColumn dataField="colC"
headerText="Column C" />
</mx:columns>
</mx:DataGrid>
<mx:Label text="{dataGrid2.dataProvider.length} items" />
</mx:VBox>
</mx:Application>
10:19 AM
|
Labels:
Flex Controls Samples,
Flex DataGrid Samples
|
This entry was posted on 10:19 AM
and is filed under
Flex Controls Samples
,
Flex DataGrid Samples
.
You can follow any responses to this entry through
the RSS 2.0 feed.
You can leave a response,
or trackback from your own site.
0 comments:
Post a Comment