1 Reply Latest reply on Dec 16, 2008 3:50 AM by Sankar Kethineni

    Drag and Drop in DataGrid/Advanced DataGrid

    Sankar Kethineni Level 1
      Hi All,
      Here is the scenario, assume that i have some 10 records in DataGrid/Advanced DataGrid .I have selected 4th record and when i try to drag the selected item to down, i should be able to drag all the records one step down from the selected record( from 4 th record to 10th record) i.e, re-arranging the items

      If i drag the selected item(assume that some 6th record) to top, say to 2nd row then from the second row all the rows has to come down.

      And How do we add the rows at middle and at the specified position?

      Any help will be appricated and Thanks in Advance.






        • 1. Re: Drag and Drop in DataGrid/Advanced DataGrid
          Sankar Kethineni Level 1

          Hi All,

          myself got the solution for re-arranging the datagrid items by using the pre-defined properties of DataGrid. I can also get the index number of Items while start dragging but the problem is how do i get the index number where the Items dropped.

          Here is the code..............
          <?xml version="1.0" encoding="utf-8"?>
          <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml" layout="horizontal">

          <mx:Script>
          <![CDATA[
          import mx.controls.Alert;
          import mx.collections.ArrayCollection;

          [Bindable]
          private var datagridData:ArrayCollection = new ArrayCollection([
          {task:"testing drag and drop",category:"Office",priority:"Medium"},
          {task:"testing datagrid DND",category:"personal",priority:"High"},
          {task:"testing services for todo",category:"office",priority:"Medium"},
          {task:"meet ravi on sunday",category:"personal",priority:"Low"},
          {task:"buy a book",category:"friends",priority:"Medium"},
          {task:"play cricket",category:"friends",priority:"Low"}]);

          private function onDragStart():void
          {
          Alert.show("selected Indices"+dataGrid.selectedIndices);
          }

          private function onDragComplete():void
          {
          Alert.show("selected Indices"+dataGrid.selectedIndices);
          }
          ]]>
          </mx:Script>

          <mx:DataGrid id="dataGrid" dataProvider="{datagridData}" dragEnabled="true" dragMoveEnabled="true"
          dropEnabled="true" allowDragSelection="true" allowMultipleSelection="true" rowCount="10"
          dragStart="onDragStart()" dragComplete="onDragComplete()"> <!--dragStart="onDragStart()"-->
          <mx:columns>
          <mx:DataGridColumn dataField="task" headerText="Task" width="200"/>
          <mx:DataGridColumn dataField="category" headerText="Category"/>
          <mx:DataGridColumn dataField="priority" headerText="Priority"/>
          </mx:columns>
          </mx:DataGrid>
          </mx:Application>