Drag and Drop Treeview To Gridview two columns

[anwar]

Hello,

I am trying to do Drag and drop a node from treeview to gridview control multiple columns, my grid has 2 columns, i want to drag and drop a node from tree to first column of the grid and again drag and drop the node(same/different) in to second column of the same row, once the two columns are filled then goes to next row. Can you help me how to acheive this.

I have the application it works only first column and when drag and drop the second node it adding the new row.

Thanks,
Anwar

[Miroslav]

Hi anwar,

It seems that you want to distinguish where an item has been dropped.

One way to achieve this will be to allow dropping in the grid cells. To do this you can set a CellStyle (which is a property on the GridView column) and there set the AllowDrop property to true. Then in your drag drop handlers you will be working with cells and not with rows. This way you can easily make the distinction between dropping into the columns.

Do you think this will work for you?

Greetings,
Miroslav
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.

[anwar]

Hello Miroslav,

Thanks for your response, i try adding AllowDrop at cell Style. When i try to add drag drop handlers i am getting the error  'object reference is not set.'

Here is my code snippet.

<telerik:RadGridView x:Name="gvObjects" AutoGenerateColumns="False"

Grid.Row="0" Grid.Column="1"

>

<telerik:RadGridView.Columns>

<telerik:GridViewDataColumn HeaderText="Continent" DataMemberBinding="{Binding Continent, Mode=TwoWay}" />

<telerik:GridViewDataColumn HeaderText="Country" DataMemberBinding="{Binding SelectedCountry, Mode=TwoWay}" >

<telerik:GridViewDataColumn.CellTemplate>

<DataTemplate>

<local:ComboBoxContainer Width="100" Height="24" />

</DataTemplate>

</telerik:GridViewDataColumn.CellTemplate>

</telerik:GridViewDataColumn>

<telerik:GridViewDataColumn x:Name="gvCell1" HeaderText="Continent"  DataMemberBinding="{Binding Continent, Mode=TwoWay}">

<telerik:GridViewDataColumn.CellStyle>

<Style TargetType="telerikGridView:GridViewCell">

<Setter Property="telerikDragDrop:RadDragAndDropManager.AllowDrop" Value="True"/>

</Style>

</telerik:GridViewDataColumn.CellStyle>

</telerik:GridVie public TreeDragDropGrid() { InitializeComponent(); gridviewsource = new ObservableCollection<MyBusinessObject>(); List<MyBusinessObject> myBusinessobjects = new List<MyBusinessObject>(); myBusinessobjects.Add(new MyBusinessObject("Europe", 0)); myBusinessobjects.Add(new MyBusinessObject("Asia", 0)); myBusinessobjects.Add(new MyBusinessObject("Afrika", 0)); RadDragAndDropManager.AddDropQueryHandler(gvCell1, OnDropQuery1); RadDragAndDropManager.AddDropInfoHandler(gvCell1, OnDropInfo1); RadDragAndDropManager.AddDropQueryHandler(gvCell2, OnDropQuery2); RadDragAndDropManager.AddDropInfoHandler(gvCell2, OnDropInfo2); gvObjects.ItemsSource = GridViewSource; } wDataColumn>

<telerik:GridViewDataColumn x:Name="gvCell2" HeaderText="Continent"  DataMemberBinding="{Binding Continent, Mode=TwoWay}">

<telerik:GridViewDataColumn.CellStyle>

<Style TargetType="telerikGridView:GridViewCell">

<Setter Property="telerikDragDrop:RadDragAndDropManager.AllowDrop" Value="True"/>

</Style>

</telerik:GridViewDataColumn.CellStyle>

</telerik:GridViewDataColumn>

</telerik:RadGridView.Columns>

</telerik:RadGridView>

Can you post the sample code for me.

Thanks,
Anwar

[Miroslav]

Hello anwar,

I am sorry for the delayed reply, we have been busy with the coming Q3 release.

Sure, I created a sample project based on some of your code and I have attached it here.

The column object is not a visual object that can be set as a drop target. It is enough to set the cells as drop targets (as you have done) and then add a handler for the drop events to some of the visual parents of the cells.

Hopefully this will help you,

Kind regards,
Miroslav
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.

[anwar]

Hello Miroslav,

Thanks for your solution. In your solution, you set the gridview Itemssource in page load and i am able to drag and drop in two columns of the same row.

But In my case the gridview does not contain any rows, it contains new collection as items source and when we drag and drop items from treeview i need to add the row column values to the collection.  So OnDropInfo and OnDropQuery

 

var

 

cell = e.Options.Destination as GridViewCell;

 

 

the cell is always be null and the rest of the code  block not firing.

Do you have any idea how to do this.

Anwar

[Miroslav]

Hi anwar,

The DragDrop works with visual items only and there is no way to know which column the user is over since it does not exist visually.

An alternative approach is to ask the user once the item has been dropped. I added a ContextMenu on successful drop that will ask the user which column he meant to drop in.

I have attached the updated example.

Do you think this will work for you?

Greetings,
Miroslav
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.