This is a migrated thread and some comments may be shown as answers.

Drag and Drop

35 Answers 964 Views

GridView

This is a migrated thread and some comments may be shown as answers.

35 Answers, 1 is accepted

answered on 16 Oct 2007, 03:38 PM

Hello dootndo2,

Thank you for this question.

The RadGridView doesn't support these drag & drop operations automatically.This feature must be implemented manually.

In order to enable drag & drop operations in the RadGridView you must process certain standard WinForms events. To enable dropping rows to other controls you must attach to MouseDown and MouseMove events and call the DoDragDrop function. To receive dropped rows you must process DragEnter, DragDrop and DragLeave events.

You can find additional information how to implement drag & drop operations on the MSDN site. Follow this link for more information:
http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dndotnet/html/dragndropops.asp

We hope this helps you. Don't hesitate to contact us if you have any other questions.

Sincerely yours,
Jack
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

answered on 03 Jun 2008, 01:00 PM

We want to have 2 data bound gridviews then drag from gridview A to gridview B. When dragging to gridview B we want the record that the mouse is currently on to be focused so that the user knows where the the item will be dragged and dropped. After this we would need to know the unique ID of where the focus was on B so we can drop the item and insert into database appropriately. Here is an example

Grid A contains
ID        FruitNames
----------------------
1            Apple
2            Orange
3            Kiwi
4            Strawberry

Grid B Contains
ID         FruitNames
----------------------
1        Pear
2        Watermellon
3        Banana

When the user drags Orange from Grid A over to Grid B and places their mouse cursor on top of Watermellon we want to highlight this Watermellon row immediately. Then in the back end find the row ID 2 so that we can use that to insert Orange between those 2 items or even replace it appropriately.

We can't find a way to highlite the row appropriately and figure out a way how to get the row selected based on where the mouse is. If you can setup a simple demo for us that would be great.

answered on 03 Jun 2008, 02:54 PM

GridDragDrop.zip

Hello starlinxy,

Thank you for getting back to me.

Please find attached a sample project implementing simple drag & drop behavior. You should use the GetElementAtPoint to find the GridRowElement at specific mouse coordinates.

Consider the following code snippet:

    
            GridViewRowInfo GetRowAtPoint(RadGridView grid, Point location) 
        
            { 
        
                RadElement element = grid.ElementTree.GetElementAtPoint(location); 
        
                if (element is GridCellElement) 
        
                { 
        
                    return ((GridCellElement)element).RowInfo; 
        
                } 
        
                if (element is GridDataRowElement) 
        
                { 
        
                    return ((GridRowElement)element).RowInfo; 
        
                } 
        
                return null; 
        
            }

I hope this helps. Please let me know if you have other questions.

Kind regards,
Jack
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

answered on 06 Oct 2009, 07:24 AM

Hi Niklas,

Thank you for your question. In order to get the selected rows before they are cleared, you have to set the grid behavior to a custom one and override OnMouseDown so that you can get the rows before the base logic. For example:

    
            public class MyGridBehavior : BaseGridBehavior 
        
            { 
        
                private List<GridViewRowInfo> rows = new List<GridViewRowInfo>(); 
        
                public override bool OnMouseDown(MouseEventArgs e) 
        
                { 
        
                    this.rows.Clear(); 
        
                    foreach(GridViewRowInfo r in this.GridControl.SelectedRows) 
        
                    { 
        
                        rows.Add(r); 
        
                    } 
        
                    return base.OnMouseDown(e); 
        
                } 
        
                public List<GridViewRowInfo> SelectedRows 
        
                { 
        
                    get 
        
                    { 
        
                        return this.rows; 
        
                    } 
        
                } 
        
            }

Now you need to create an instance of this behavior, keep a reference to it, and set it to RadGridView like so:

    
            MyGridBehavior behavior = new MyGridBehavior(); 
        
            this.radGridView1.GridBehavior = behavior;

After this is in place you have to handle MouseDown event of RadGridView and get the selected rows through MyGridBehavior reference.

Write again if you have other questions.

Regards,
Victor
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

answered on 14 Oct 2009, 07:43 AM

Hello,

I am having the same challenge as Niklas: I want to be able to select multiple rows from a RadGridView and drag and drop them onto a RadTreeView. The code examples with OnMouseDown in combination with the custom GridBehavior works, but is not ideal yet. When you select multiple grid rows and then click again to drag them, it looks like only one row is selected. After you drop them you have to select the other rows again if you want to drag the same rows again somewhere else...

Any suggestions how I can improve this? And I know it has been asked before, but when do you think that drag and drop is fully implemented in the RadGridView? I could really use it :-)

Thanks in advance.

answered on 13 Nov 2009, 06:44 PM

I think A. Bennen was referring to the problem that I am encountering. When dragging and dropping on the Telerik GridView with multiple rows selected, the selection is reduced to a single row on MouseDown (unless the CTRL key is pressed). This is very unintuitive behavior. The selection should not be reduced to a single row until MouseUp. Users expects that when they begin to drag, ALL of the selected rows will remain selected until they release the mouse on an acceptable target. It is NOT an acceptable workaround to just reselect the rows after the drag/drop is completed because WHILE the user is dragging it appears that they are only dragging one row.

I found the other thread where it was shown how to create a bitmap of the rows that you are dragging. This is nice, but the original problem remains. I ask outright: why is the row selection reduced to a single row on MouseDown instead of MouseUp? Is this something that can be fixed? We need to have an acceptable fix or workaround or I cannot convince my manager to use the Telerik GridView.

Thank you,
NC

answered on 23 Apr 2010, 01:43 PM

Hi Nathaniel,

Drag and drop is not supported naively yet. As demonstrated in this thread it could be easily implemented with a few lines of code. Please, tell us whether this solution is suitable for you. If not, describe the exact behavior that you want to achieve and I will be glad to assist you.

We will have in mind the drag & drop feature and we will try to implement it in a future release. Could you please describe what you expect from this feature? We will appreciate your feedback.

Kind regards,
Jack
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

answered on 30 Aug 2010, 09:30 PM

Hello sonu,

Thank you for this question.

First, you have to set the MultiSelect property to true and SelectionMode to FullRowSelect. Here is a sample:

this.radGridView1.MultiSelect = true;

this.radGridView1.SelectionMode = Telerik.WinControls.UI.GridViewSelectionMode.FullRowSelect;

You have two options when using mouse to select rows:

1. Keep pressed the Control key and click on the rows that you want to select.
2. Keep the left mouse button pressed and start dragging over the rows that you want to select.

I hope this helps. If you have any other questions, do not hesitate to contact us.

Sincerely yours, Jack
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

answered on 08 Mar 2011, 03:55 PM

Thanks for these samples. I've tried both the files referenced here (087627_GridDragDrop.zip and 158846_dragndrop.zip), and neither of them work with the current framework. The errors are along the lines of:

Error 1 'Telerik.WinControls.UI.GridViewRowInfo' does not contain a definition for 'VisualElement' and no extension method 'VisualElement' accepting a first argument of type 'Telerik.WinControls.UI.GridViewRowInfo' could be found (are you missing a using directive or an assembly reference?) D:\dev\bex2\GridDragDrop\GridDragDrop\Form1.cs 65 41 GridDragDrop

The XAML version mentioned elsewhere in the thread is working, but that's for the XAML GridView rather than the WinForms one. Is there an updated example for the WinForms control? Or is this now a "native" feature of the GridView and I'm just missing the steps to set it in the latest version?

answered on 16 Mar 2011, 05:41 PM

DragNDrop.zip

Hi John ,

Both projects represent the same solution. I modified it to be compatible with our latest release, please check the attached project.

There is an example demonstrating drag & drop between grids in our demo application. It is located under GridView >> Rows >> Rows Drag & Drop.

Should you have any further questions, do not hesitate to ask.

All the best,
Jack
the Telerik team

Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!

answered on 16 May 2014, 01:33 PM

Hello Mathieu,

Thank you for writing.

To achieve the desired behavior you can use the standard drag and drop functionality. For example if you have a column that contains a file path you can copy it to a folder like this:

void radGridView1_MouseDown(object sender, MouseEventArgs e)

{

GridDataCellElement el = radGridView1.GridViewElement.ElementTree.GetElementAtPoint(e.Location) as GridDataCellElement;

if (el != null)

{

string path = (string)el.Value;

if (File.Exists(path))

{

string[] filesToDrag =

{

path

};

DataObject dob = new DataObject();

dob.SetData(DataFormats.FileDrop, filesToDrag);

this.radGridView1.DoDragDrop(dob, DragDropEffects.Copy);

}

I hope this helps. Should you have any other questions do not hesitate to ask.

Regards,
Dimitar
Telerik

Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.

answered on 22 May 2014, 09:51 AM

Hello Mathieu,

Thank you for writing back.

If I understand correctly you want the the grid rows to remain selected when you drag and drop them in the explorer. This can be achieved by creating a custom grid behavior. For example:

public class CustomGridBehavior : BaseGridBehavior

{

List<GridViewRowInfo> selectedRows = new List<GridViewRowInfo>();

public List<GridViewRowInfo> SelectedRows

{

get

{

return this.selectedRows;

}

public override bool OnMouseUp(MouseEventArgs e)

{

base.OnMouseDown(e);

return base.OnMouseUp(e);

}

public override bool OnMouseDown(MouseEventArgs e)

{

selectedRows.Clear();

selectedRows.AddRange(this.GridControl.SelectedRows);

return true;

}

The behavior can be changed as follows:

radGridView1.GridBehavior = new CustomGridBehavior();

Also you can recreate the MouseDown event in order to copy all the files:

void radGridView1_MouseDown(object sender, MouseEventArgs e)

{

GridDataCellElement el = radGridView1.GridViewElement.ElementTree.GetElementAtPoint(e.Location) as GridDataCellElement;

if (el != null)

{

if (ModifierKeys == Keys.None)

{

string[] filesToDrag = new string[radGridView1.SelectedRows.Count];

for (int i = 0; i < radGridView1.SelectedRows.Count; i ++)

{

string path = (string)radGridView1.SelectedRows[i].Cells[0].Value;

if (File.Exists(path))

{

filesToDrag[i] = path;

}

DataObject dob = new DataObject();

dob.SetData(DataFormats.FileDrop, filesToDrag);

this.radGridView1.DoDragDrop(dob, DragDropEffects.Copy);

}

I hope this helps.

Regards,
Dimitar
Telerik