Changing row appearance on drag over sfDataGrid

[Allan]

Hi

I've implemented drag/drop from Microsoft Outlook onto a WPF sfdatagrid by writing an extension for the  GridRowDragDropController.

I'd like to extend this further to highlight the current target row on the sfdatagrid on a dragover.  I'm assuming I need to modify ProcessOnDragOver somehow to achieve this. Using ShowDragIndicators is not giving me what I need in this case.

Are you able to assist with how to achieve this?

Thanks

Allan Seagrott

[Deivaselvan Y]

Hi Allan, 

Thank you for contacting Syncfusion Support. 

We have analyzed your query to highlight the target record while dragging and you can achieve this by setting SfDataGrid.SelectedIndex with the target record index in ProcessOnDragOver method as like below code snippet 

public class GridRowDragDropControllerExt : GridRowDragDropController 

    { 

        ObservableCollection<object> draggingRecords = new ObservableCollection<object>(); 

 

        /// <summary> 

        /// Occurs when the input system reports an underlying dragover event with this element as the potential drop target. 

        /// </summary> 

        /// <param name="args">An <see cref="T:Windows.UI.Xaml.DragEventArgs">DragEventArgs</see> that contains the event data.</param> 

        /// <param name="rowColumnIndex">Specifies the row column index based on the mouse point.</param> 

        protected override void ProcessOnDragOver(DragEventArgs args, RowColumnIndex rowColumnIndex) 

        { 

            if (args.Data.GetDataPresent("ListViewRecords")) 

                draggingRecords = args.Data.GetData("ListViewRecords") as ObservableCollection<object>; 

            else 

                draggingRecords = args.Data.GetData("Records") as ObservableCollection<object>; 

 

            if (draggingRecords == null) 

                return; 

 

            //To highlight the target record while dragging 

            var targetRecordIndex = this.DataGrid.ResolveToRecordIndex(rowColumnIndex.RowIndex); 

            this.DataGrid.SelectedIndex = targetRecordIndex; 

 

            //To get the dropping position of the record 

            var dropPosition = GetDropPosition(args, rowColumnIndex, draggingRecords); 

 

            //To Show the draggable popup with the DropAbove/DropBelow message 

            ShowDragDropPopup(dropPosition, draggingRecords, args); 

            //To Show the up and down indicators while dragging the row 

            ShowDragIndicators(dropPosition, rowColumnIndex, args); 

 

            args.Handled = true; 

        } 

 

        ListView listview; 

 

        /// <summary> 

        /// Occurs when the input system reports an underlying drop event with this element as the drop target. 

        /// </summary> 

        /// <param name="args">An <see cref="T:Windows.UI.Xaml.DragEventArgs">DragEventArgs</see> that contains the event data.</param> 

        /// <param name="rowColumnIndex">Specifies the row column index based on the mouse point.</param> 

        protected override void ProcessOnDrop(DragEventArgs args, RowColumnIndex rowColumnIndex) 

        { 

            if (args.Data.GetDataPresent("ListView")) 

                listview = args.Data.GetData("ListView") as ListView; 

 

            if (!DataGrid.SelectionController.CurrentCellManager.CheckValidationAndEndEdit()) 

                return; 

 

            //To get the dropping position of the record 

            var dropPosition = GetDropPosition(args, rowColumnIndex, draggingRecords); 

            if (dropPosition == DropPosition.None) 

                return; 

 

            // to get the index of dropping record 

            var droppingRecordIndex = this.DataGrid.ResolveToRecordIndex(rowColumnIndex.RowIndex); 

 

            if (droppingRecordIndex < 0) 

                return; 

 

            // to insert the dragged records based on dropping records index  

            foreach (var record in draggingRecords) 

            { 

                if (listview != null) 

                { 

                    (listview.ItemsSource as ObservableCollection<Orders>).Remove(record as Orders); 

                    var sourceCollection = this.DataGrid.View.SourceCollection as IList; 

 

                    if (dropPosition == DropPosition.DropBelow) 

                    { 

                        sourceCollection.Insert(droppingRecordIndex + 1, record); 

                        //To highlight the dropped record 

                        this.DataGrid.SelectedIndex = droppingRecordIndex + 1; 

                    } 

                    else 

                    { 

                        sourceCollection.Insert(droppingRecordIndex, record); 

                        //To highlight the dropped record 

                        this.DataGrid.SelectedIndex = droppingRecordIndex; 

                    } 

                } 

                else 

                { 

                    var draggingIndex = this.DataGrid.ResolveToRowIndex(draggingRecords[0]); 

 

                    if (draggingIndex < 0) 

                    { 

                        return; 

                    } 

 

                    // to get the index of dragging row 

                    var recordindex = this.DataGrid.ResolveToRecordIndex(draggingIndex); 

                    // to ger the record based on index 

                    var recordEntry = this.DataGrid.View.Records[recordindex]; 

                    this.DataGrid.View.Records.Remove(recordEntry); 

                    var droppingIndex = droppingRecordIndex; 

                    // to insert the dragged records to particular position 

                    if (draggingIndex < rowColumnIndex.RowIndex && dropPosition == DropPosition.DropAbove) 

                        this.DataGrid.View.Records.Insert(droppingRecordIndex - 1, this.DataGrid.View.Records.CreateRecord(record)); 

                    else if (draggingIndex > rowColumnIndex.RowIndex && dropPosition == DropPosition.DropBelow) 

                        this.DataGrid.View.Records.Insert(droppingRecordIndex + 1, this.DataGrid.View.Records.CreateRecord(record)); 

                    else 

                        this.DataGrid.View.Records.Insert(droppingRecordIndex, this.DataGrid.View.Records.CreateRecord(record)); 

                } 

            } 

            //Closes the Drag arrow indication all the rows 

            CloseDragIndicators(); 

            //Closes the Drag arrow indication all the rows 

            CloseDraggablePopUp(); 

        } 

    } 

Please find sample for the same from the below link 

Sample Link: 

http://www.syncfusion.com/downloads/support/forum/143964/ze/RowDragAndDropBetweenControls1524756247  

Note: In the above sample, we have highlighted the record after dropped in datagrid. If you don’t want to highlight the dropped record, you can set SelectedIndex as -1 at the end of ProcessOnDrop method in GridRowDragDropControllerExt. 

Please let us know, if you need any further assistance on this. 

Regards,
Deivaselvan 

[Allan]

Hi Deivaselvan 

Thank you for the detailed example. I've extracted the code I need and have now got it working.

One question, I've been using the following code where I've referenced the target row by using the parameter rowColumnIndex.RowIndex and subtracting 1. and it's given me the correct result in each case.

this.DataGrid.SelectedIndex = rowColumnIndex.RowIndex - 1;

Should I be calculating the recordindex using ResolveToRecordIndex as you're doing in your example?

var targetRecordIndex = this.DataGrid.ResolveToRecordIndex(rowColumnIndex.RowIndex); 

            this.DataGrid.SelectedIndex = targetRecordIndex; 

Thanks

Allan

[Shobika Palani]

Hi Allan,  

 

We have analyzed your query to retrieve the target row index by using parameter rowColumnIndex.RowIndex and subtracting 1. By default, we will set the record index for SelectedIndex property.  It will give the same result in your case as you have not used any other rows above the record like AddNewRow, FilterRow, TableSummaryRow and unbound rows. In those case, subtracting 1 will not give the correct result. For that we have helper method to retrieve the record index using ResolveToRecordIndex. So, we suggest you to make use of the helper method.  

 

Please refer the below UG link for more details.  

UG Link:  

https://help.syncfusion.com/wpf/sfdatagrid/helpers#example-you-can-find-the-record-index-from-row-index-using-resolvetorecordindex-method   

 

Regards,  

Shobika   

[Allan]

Hi 

Thank you for clarifying the use of the helper method.

Regards

Allan

[Dinesh Babu Yadav]

Hi Allan, 

 

Thanks for the update. Please let us know if you require further assistance. 

 

Regards, 

Dinesh Babu Yadav