product caption

First Look

Run example in: C# VB.NET



Mouseover the left/top tabstrips and click on the tabs of the right one to open the hidden sliding panes

Please note that the vertical tabs use proprietary text-direction styles, which are supported by Microsoft Internet Explorer only.

Pane1
Pane2
Pane3
Spacer
Pane1
Pane2
Pane3
Spacer

New product updates and features coming soon

It's been a while since we've been last active on the blog. I can assure you that a lot of things are cooking at Telerik and you will get a lot of new surpirses soon. Take a look at our forums page for a sneak peak at live public betas - currently, a very busy and active beta is going on for our newest product, RadSplitter and the new major updates of RadPanelBar 4.0 and RadTreeView 6.0.

http://www.telerik.com/forums

I just wanted to let you know about a cool new feature in RadTreeView that is still not live - expected in RadTreeView 6.0 Beta 2 which will be released tomorrow - drag and drop in-between treenodes.



Just set the [new] DragAndDropBetweenNodes property and you can now drop over, below or above a node, with a visual marker (currently a dotted line) providing a visual clue for end-users. The server-side API needed to take care of this functionality is simple as well - just a new enumeration in the event arguments passed to the NodeDrop event - DropPosition (DropPosition.Over,DropPosition.Below, DropPosition.Above) in addition to the source and destination nodes. The new methods RadTreeNode.InsertBefore and RadTreeNode.InsertAfter are very convenient as well - only a few lines of code are required. The code needed to handle all cases (child, sibling above, sibling below) is now very simple:

private static void PerformDragAndDrop (RadTreeViewDropPosition dropPosition, RadTreeNode sourceNode, RadTreeNode destNode)
{
    switch (dropPosition)
    {
        case RadTreeViewDropPosition.Over:
            // child
            if (!sourceNode.IsAncestorOf(destNode))
            {
                sourceNode.Owner.Nodes.Remove(sourceNode);
                destNode.Nodes.Add(sourceNode);
            }
            break;

        case RadTreeViewDropPosition.Above:
            // sibling - above
            sourceNode.Owner.Nodes.Remove(sourceNode);
            destNode.InsertBefore(sourceNode);
            break;

        case RadTreeViewDropPosition.Below:
            // sibling - below
            sourceNode.Owner.Nodes.Remove(sourceNode);
            destNode.InsertAfter(sourceNode);
            break;
    }
}

Of course, as usual, just wrap the treeview inside an RadAjax AjaxPanel (or use AjaxManager) and the NodeDrop postback event will automatically be converted to ajax callback for even better usability. All of this - code-free.

posted on Thursday, September 21, 2006 10:51 AM by Rumen Stankov

Spacer
Pane1
Pane2
Pane3

Source Code & Description