Drag & Drop doesn't work with DataTemplate

[Nicole]

Hello Team,

I've got a Listbox and a GridLayout. The GridLayout is hosted by an ItemsControl and styled by a DataTemplate. This works fine.
Now the user should be able to drag an item from the listbox into the GridLayout. This works too, but only if the payload is being dropped on the TextBlock. Otherwise the DragStatus is always DropImpossible. It should be possible to drop the payload anywhere into the grid cell.

I have studied the examples but I can't get it to work.
Could please have a look at my code?

<Page.Resources>
    <DataTemplate DataType="{x:Type local:ViewModelRasterElement}">
        <Border BorderBrush="#EFEFEF" BorderThickness="1"
                telerikDragDrop:RadDragAndDropManager.AllowDrop="True"
                telerikDragDrop:RadDragAndDropManager.AllowDrag="True">

                <TextBlock VerticalAlignment="Center" HorizontalAlignment="Center"
                           Text="{Binding Bezeichnung}"/>
        </Border>
    </DataTemplate>

    <DataTemplate x:Key="ApplicationDragTemplateTextbox">
        <TextBox Width="200" Height="20"/>
    </DataTemplate>
    <DataTemplate x:Key="ApplicationDragTemplateLabel">
        <Label Background="Yellow" Content="Ziehen Sie den in eine bliebige Zelle"/>
    </DataTemplate>
</Page.Resources>

<ItemsControl ItemsSource="{Binding RasterElemente}">
    <ItemsControl.ItemContainerStyle>
        <Style>
            <Setter Property="Grid.Row" Value="{Binding GridRow}" />
            <Setter Property="Grid.Column" Value="{Binding GridColumn}" />
        </Style>
    </ItemsControl.ItemContainerStyle>
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <Grid ShowGridLines="false"
                  telerikDragDrop:RadDragAndDropManager.AllowDrop="True"
                  telerikDragDrop:RadDragAndDropManager.AllowDrag="True">
                <Grid.RowDefinitions>
                    <RowDefinition Height="50"/>
                    <RowDefinition Height="50"/>
                    <RowDefinition Height="50"/>
                    <RowDefinition Height="50"/>
                    <RowDefinition Height="50"/>
                    <RowDefinition Height="50"/>
                    <RowDefinition Height="50"/>
                    <RowDefinition Height="50"/>
                    <RowDefinition Height="50"/>
                    <RowDefinition Height="50"/>
                    <RowDefinition Height="50"/>
                    <RowDefinition Height="50"/>
                    <RowDefinition Height="50"/>
                    <RowDefinition Height="50"/>
                    <RowDefinition Height="50"/>
                    <RowDefinition Height="50"/>
                    <RowDefinition Height="50"/>
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="130"/>
                    <ColumnDefinition Width="130"/>
                    <ColumnDefinition Width="130"/>
                    <ColumnDefinition Width="130"/>
                    <ColumnDefinition Width="130"/>
                    <ColumnDefinition Width="130"/>
                    <ColumnDefinition Width="130"/>
                    <ColumnDefinition Width="130"/>
                </Grid.ColumnDefinitions>
            </Grid>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
</ItemsControl>

And here the code behind:

public ViewTest()
{
    InitializeComponent();

    RadDragAndDropManager.AddDragQueryHandler(this, OnDragQuery);
    RadDragAndDropManager.AddDropQueryHandler(this, OnDropQuery);
    RadDragAndDropManager.AddDropInfoHandler(this, OnDropInfo);
}

private void OnDropInfo(object sender, DragDropEventArgs e)
{
    Console.WriteLine(e.Options.Status);
    if (e.Options.Status == DragStatus.DropComplete)
    {
        string typ = e.Options.Source.GetType().ToString();
        switch (typ)
        {
            case "System.Windows.Controls.ListBox":
                {
                    if (e.Options.Payload != null)
                    {
                        ViewModelRasterElement element = (ViewModelRasterElement)e.Options.Destination.DataContext;
                        element.Bezeichnung = e.Options.Payload.ToString();
                    }
                }
                break;
            default:
                break;
        }
    }
    e.Handled = true;
}

void OnDropQuery(object sender, DragDropQueryEventArgs e)
{
    Console.WriteLine(e.Options.Status);
    Console.WriteLine(e.Options.Destination.DataContext.GetType().ToString());

    if (e.Options.Destination.DataContext is ViewModelRasterElement &&
        e.Options.Status == DragStatus.DropDestinationQuery)
    {
        e.QueryResult = true;
    }
    e.Handled = true;
    Console.WriteLine(e.QueryResult);
}

protected virtual void OnDragQuery(object sender, DragDropQueryEventArgs e)
{
    string typ = e.Options.Source.GetType().ToString();
    switch (typ)
    {
        case "System.Windows.Controls.ListBox":
            {
                ListBox listbox = (ListBox)e.Options.Source;
                if (listbox.SelectedItem != null)
                {
                    if (e.Options.Status == DragStatus.DragQuery)
                    {
                        e.Options.Payload = listbox.SelectedItem;
                        ContentControl cue = new ContentControl();
                        cue.ContentTemplate = this.Resources["ApplicationDragTemplateLabel"] as DataTemplate;
                        cue.Content = listbox.SelectedItem;
                        e.Options.DragCue = cue;
                        e.Options.ArrowCue = RadDragAndDropManager.GenerateArrowCue();
                    }
                }
            }

            break;
        default:
            break;
    }

    e.Handled = true;
    e.QueryResult = true;
}

Thank you for your assistance.

Best regards

Josef

[Arthur]

Hi,
I struggle with similar issue myself.
Have you make it to work?