Drag drop rarely offers me "DropInto" opportunity

[Matt Greer]

I have a RadTreeView with its drag and drop turned on, as well as IsDragPreviewEnabled set to true.  I have an event handler that listens to PreviewDragEnded, and my handler handles the rewiring of my entities in reaction to the drag/drop.

The problem is the RadTreeView almost never allows me to do a "DropInto", it almost always just gives me a "DropBefore". This means if item A has no child nodes, I am unable to drop item B onto A to make B a child of A. It only gives me the option to make B a sibling of A before it.

If my very first node in the tree has children, then in this case DropInto is possible, but only for this node.

Is there something I need to do to make "DropInto" work for nodes that are childless?


I am using Silverlight 4, and Telerik Silverlight controls version 2010.2.812.1040

[Matt Greer]

This appears to be a bug in RadTreeView. Can someone at Telerik please chime in? This is currently blocking me. I cannot create a support ticket right now as I am in the process of changing our Telerik account over to my email address.

I created a simple sample that shows the bug:

<UserControl x:Class="RadTreeViewTest.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">

    <Grid x:Name="LayoutRoot" Background="White">
        <telerik:RadTreeView ItemsSource="{Binding TreeItems}" IsDragDropEnabled="True" IsDragPreviewEnabled="True" IsDropPreviewLineEnabled="True">
            <telerik:RadTreeView.ItemTemplate>
                <telerik:HierarchicalDataTemplate ItemsSource="{Binding Children}">
                    <Border BorderBrush="Red" Margin="5" BorderThickness="1">
                        <TextBlock Text="{Binding Name}" Margin="20" />
                    </Border>
                </telerik:HierarchicalDataTemplate>
            </telerik:RadTreeView.ItemTemplate>
        </telerik:RadTreeView>
    </Grid>
</UserControl>

and the code behind:

namespace RadTreeViewTest
{
    public class TreeItem
    {
        public string Name { get; set; }
        public ObservableCollection<TreeItem> Children { get; set; }
    }

    public partial class MainPage : UserControl, INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler  PropertyChanged;

        private ObservableCollection<TreeItem> _treeItems;

        private static int _nameCounter = 0;
        private static Random _random = new Random();

        private ObservableCollection<TreeItem> CreateTreeItems(int depth)
        {
            ObservableCollection<TreeItem> items = new ObservableCollection<TreeItem>();

            if (depth == 4)
            {
                return items;
            }

            int min = depth == 0 ? 3 : 0;
            int max = min + 4;

            int childCount = _random.Next(min, max);

            for (int i = 0; i < childCount; ++i)
            {
                items.Add(new TreeItem() { Name = "Item" + _nameCounter++, Children = CreateTreeItems(depth + 1) });
            }

            return items;
        }

        public MainPage()
        {
            InitializeComponent();
            DataContext = this;
            TreeItems = CreateTreeItems(0);
        }

        public ObservableCollection<TreeItem> TreeItems
        {
            get
            {
                return _treeItems;
            }
            set
            {
                if (_treeItems != value)
                {
                    _treeItems = value;
                    if (PropertyChanged != null)
                    {
                        PropertyChanged(this, new PropertyChangedEventArgs("TreeItems"));
                    }
                }
            }
        }
    }
}

When you run this project, you get a RadTreeView randomly populated with some dummy items. If you attempt to drag an item into another node that has no children, you almost never get the "Drop into" option. I have been able to get it once, but I've never been able to get it again. This really limits the usefulness of RadTreeView's drag and drop.

Is there something I am missing? If there is a reliable way to get "Drop Into" drag and drop, please let me know. Thanks.

[Matt Greer]

Here is a video demonstrating the problem. 

http://www.youtube.com/watch?v=Qd3jPx-G5Gc

(recommend setting it to 480p)


As you can see, I want to drop Item12 into Item10, but I am never offered that option. It does offer me the option for most other nodes, but never for Item10. This particular running of the app offered me the "drop in" far more often that it usually does.

This video is showing the above sample app running.

I am using Silverlight 4, and Telerik Silverlight controls version 2010.2.812.1040


Thanks!

[Tina Stancheva]

Hi Matt Greer,

Unfortunately we couldn't reproduce the issue on our side. Can you please take a look at the attached example and let me know if it works for you. Also, this video illustrates the behavior on our side.

If the attached project does reproduce the issue on your side, can you please share with us your OS version, also on which browser's version the issue is reproduced, and what is the version of the Silverlight plugin on your machine. We'll appreciate any additional information that you might give us since this will help us further investigate the cause for the described behavior.

Thank you in advance.

Greetings,
Tina Stancheva
the Telerik team

[Matt Greer]

Yes, I can still reproduce this with your project. I reproduced it with your project exactly as is. Then I changed the CreateTreeItems method to not be random, it produces the same tree everytime with this:

private ObservableCollection<TreeItem> CreateTreeItems()
{
    ObservableCollection<TreeItem> items = new ObservableCollection<TreeItem>();

    int counter = 0;

    for (int i = 0; i < 3; ++i)
    {
        TreeItem item = new TreeItem() { Name = "Item" + counter++ };
        ObservableCollection<TreeItem> children = new ObservableCollection<TreeItem>();
        for (int k = 0; k < 3; ++k)
        {
            TreeItem child = new TreeItem() { Name = "Item" + counter++ };
            ObservableCollection<TreeItem> grandchildren = new ObservableCollection<TreeItem>();
            for (int j = 0; j < 2; ++j)
            {
                TreeItem grandchild = new TreeItem() { Name = "Item" + counter++, Children = new ObservableCollection<TreeItem>() };
                grandchildren.Add(grandchild);
            }
            child.Children = grandchildren;
            children.Add(child);
        }
        item.Children = children;
        items.Add(item);
    }

    return items;
}

With that change to the project, I can still reproduce the bug. Here is a new video with the non-random version of the project illustrating the bug. Notice I can drop into on the first set of nodes, but the remaining ones I cannot. Except later on it does offer me drop in into Item5, but no other items. The drop in offering seems to be a bit randomly offered.

http://www.youtube.com/watch?v=aVFo_0h4G7I

(recommend 720p and fullscreen)



For this particular video, I am using:
Windows 7 Professional 64 bit
Internet Explorer 8, 8.0.7600.16385
Silverlight plugin version 4.0.50826.0
Telerik Silverlight controls 2010.2.812.1040



NOTE, does not repro in Chrome!

Interesting, running the same project in Chrome instead of IE does not repro the bug. It works perfectly in Chrome.
Same Windows 7 box
Chrome version 6.0.472.62
Same Silverlight plugin version 4.0.50826.0
Same Telerik version

When I run this project from chrome, I get a brief watermark saying I am using a trial version of Telerik. I do not get this watermark in IE. Could it be IE is somehow picking up on my installed, licensed version of Telerik? 




EDIT: for the record, my real project exhibits the bug in IE8 but not in Chrome 6. I wish the answer could be "just use Chrome" :), but unfortunately we need to support IE.

[Vladislav]

Hello Matt Greer,

Thank you for your cooperation.
We are releasing our Q2 2010 SP2 official version of our controls. In this release we have addressed some Drag & Drop related issues in the RadTreeView control.
The new binaries should be available for downloading tomorrow.

Can you please try your project with the SP2 binaries and let us know if you still experience this issue?

Sincerely yours,
Vladislav
the Telerik team

[David Glass]

fyi, I am experiencing exactly the same symptoms in the same environment (Win 7 x64, works in Chrome, not in IE8).  I just tested SP2 and it does not resolve the issue.  The Telerik TreeView drag-drop samples exhibit the same problem, even with the latest version of SL4.

This is very important to my application.  I know it worked properly in a previous version of the controls for SL3.

[Matt Greer]

I have filed a support ticket for this bug: 352553.


I can also confirm that SP2 does not fix this bug.

[Matt Greer]

I have good news :)

This bug occurs in IE when it is zoomed in. My IE was set to 120% zoom somehow (you can see the zoom setting in the lower right corner of IE).

Setting it back to 100% fixes this bug. So, I would still argue the bug still exists, but it's not nearly as bad.

[David Glass]

that's awesome!  Mine was set to 110% somehow.

thanks!

[Tina Stancheva]

Hello gyus,

Thank you for the feedback. We did managed to reproduce the issue by zooming the browser. Therefore I added the issue in our PITS where you will be able to track it.

Also, Matt thank you for the efforts in investigating the cause for the issue. I updated your Telerik points accordingly.

Sincerely yours,
Tina Stancheva
the Telerik team

[Eric Meehan]

Does anyone know if this zoom bug has ever been fixed in any of the newer Telerik releases?

[Tina Stancheva]

Hi Eric Meehan,

Due to the many pressing tasks in our to-do list we haven't fixed this issue yet. We will do our best to start working on the issue during the Q3 release.

Greetings,
Tina Stancheva
the Telerik team