Saving DataTable ItemSource after drag and drop functionality

[Aleksander Zotov]

Greetings!

I am using DataTable as a data souce for my SfDataGrid. I have reorder of columns and rows via drag and drop, but somehow this change does not update binded data source.

How can I achieve saving of reordered columns and row within DataTable?

Thank you in advance.

[Shobika Palani]

Hi Aleksander, 

Thank you for contacting Syncfusion Support. 

We have analyzed your query to re-order rows and columns in underlying datatable based on the visual order after drag and drop. This requirement can be achieved by handling RowDragDropController.Dropped event and QueryColumnDragging event. 

1. Reordering of rows

 

Please refer to the below code snippet to reorder rows based on visual order after drag and drop 

 

this.datagrid.RowDragDropController.Dropped += RowDragDropController_Dropped; 

 

private void RowDragDropController_Dropped(object sender, GridRowDroppedEventArgs e) 

        { 

            if (e.DropPosition != DropPosition.None) 

            { 

                //Get Dragging records  

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

 

                //Gets the TargetRecord from the underlying collection using record index of the TargetRecord (e.TargetRecord)  

                var targetRow = viewModel.GridItemSource.Rows[(int)e.TargetRecord]; 

 

                ////Use Batch update to avoid data operatons in SfDataGrid during records removing and inserting  

                this.datagrid.BeginInit(); 

 

                var dataCollection = new List<object>(); 

                ////Removes the dragging records from the underlying collection  

                foreach (DataRowView item in draggingRecords) 

                { 

                    List<object> rowData = new List<object>(); 

                    foreach (var column in item.Row.ItemArray) 

                        rowData.Add(column); 

                    dataCollection.Add(rowData); 

                    viewModel.GridItemSource.Rows.Remove(item.Row); 

                } 

 

                //Find the target record index after removing the records  

                int targetIndex = viewModel.GridItemSource.Rows.IndexOf(targetRow); 

                int insertionIndex = e.DropPosition == DropPosition.DropAbove ? targetIndex : targetIndex + 1; 

                insertionIndex = insertionIndex < 0 ? 0 : insertionIndex; 

 

                //Insert dragging records to the target position  

                for (int i = draggingRecords.Count - 1; i >= 0; i--) 

                { 

                    var newRow = viewModel.GridItemSource.NewRow(); 

                    var rowValues = dataCollection[i] as List<object>; 

                    for (int j = 0; j < rowValues.Count; j++) 

                        newRow[j] = rowValues[j]; 

                    viewModel.GridItemSource.Rows.InsertAt(newRow, insertionIndex); 

                } 

                this.datagrid.EndInit(); 

            } 

        } 

 

 

 

2. Reordering of columns

 

Please refer to the below code snippet to reorder columns based on visual order after drag and drop 

 

this.datagrid.QueryColumnDragging += Datagrid_QueryColumnDragging; 

 

private void Datagrid_QueryColumnDragging(object sender, QueryColumnDraggingEventArgs e) 

        { 

            if(e.Reason == QueryColumnDraggingReason.Dropped) 

            { 

                var droppedColumn = viewModel.GridItemSource.Columns[e.From]; 

                droppedColumn.SetOrdinal(e.To); 

            } 

        } 

 

 

Also we have prepared demo sample to achieve your requirement and please find it from the link below 

Demo Link: 

https://www.syncfusion.com/downloads/support/forum/148552/ze/SfDataGrid_DataTable11990190  

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

Regards, 

Shobika. 

[Aleksander Zotov]

Thank you very much!

Everything worked perfectly!

[Farjana Parveen Ayubb]

Hi Aleksander,  

 

Thanks for the update. 

 

We are glad to know that the reported problem has been resolved at your end. Please let us know if you have any further queries on this. We are happy to help you. 

 

Regards, 

Farjana Parveen A