Multi-Item Drag and Drop RadListBox

Posted by: the telerik blogs, on 27 Aug 2009 | View original | Bookmarked: 0 time(s)

Earlier this week, I ran across a forum post asking about how one would go about creatingmultiple RadListBoxes that supportedmulti-item drag and drop. This sounded like a fun challenge, so I decided to take it on.Referencing an earlier forum post that described single-item drag and drop, I came up with the following solution.

Calling DoDragDrop() immediately changes the mouse pointer and readies the RadListBoxfor the drag-and-drop operation. Originally, I had tried calling this function in the MouseDown event, but this lead to unpredictable clunky behavior due to the fact that DoDragDrop() was getting called before I had the chance to select multiple items. In the following code, Ive set up the DoDragDrop() method to get called in the MouseMove event when the mouse button is currently down. I also made sure to keep track of in-progress drag operationsin order to preventcalling the DoDragDrop() methodhundred oftimes. (Note: Both RadListBoxes must be subscribed to these events)

boolisMouseDown=false;
boolisDragAndDrop=false;
privatevoidradListBox_MouseDown(objectsender,MouseEventArgse)
{
isMouseDown=true;
}
privatevoidradListBox_MouseMove(objectsender,MouseEventArgse)
{
if(!isMouseDown||isDragAndDrop)return;
RadListBoxlistBox=senderasRadListBox;
listBox.DoDragDrop(listBox.SelectedItems.ToList(),DragDropEffects.Copy);
isDragAndDrop=true;
}
privatevoidradListBox_MouseUp(objectsender,MouseEventArgse)
{
isMouseDown=false;
isDragAndDrop=false;
}

In the DragDrop event, I simply iterated through the list of RadItems I passed to the event through the DoDragDrop() method, swapping each item from its former RadListBox to the new RadListBox.

privatevoidradListBox_DragOver(objectsender,DragEventArgse)
{
e.Effect=DragDropEffects.Copy;
}
privatevoidradListBox_DragDrop(objectsender,DragEventArgse)
{
RadListBoxlistBox=senderasRadListBox;
List<RadItem>items=(List<RadItem>)e.Data.GetData(typeof(List<RadItem>));
RadListBoxsourceListBox=items[0].ElementTree.ControlasRadListBox;
foreach(RadItemlstBoxIteminitems)
{
sourceListBox.Items.Remove(lstBoxItem);
listBox.Items.Add(lstBoxItem);
}
}

Try it out yourself, orclick here to download the source code!

Advertisement
Free Agile Project Management Tool from Telerik
TeamPulse Community Edition helps your team effectively capture requirements, manage project plans, assign and track work, and most importantly, be continually connected with each other.
Category: Mobile | Other Posts: View all posts by this blogger | Report as irrelevant | View bloggers stats | Views: 2931 | Hits: 30

Similar Posts

  • Data-binding Telerik CoverFlow for Silverlight + some Routed Commands goodness more
  • Custom Panels in Silverlight/WPF Part 4: Virtualization more
  • Customizing the SharePoint ECB with Javascript, Part 2 more
  • URL Shortening in SharePoint with bit.ly more
  • Getting and setting max zIndex with jQuery more
  • TreeView in ComboBox, take 3 (Silverlight 3, WPF and RadControls) more
  • Drag and drop items onto RadScheduler for Silverlight more
  • RadDrag&Drop with a Canvas twist more
  • How to create a DropDownList with ASP.NET MVC more
  • Reporting Release History : Q2 2009 SP1 (version 3.1.9.807) more

News Categories

.NET | Agile | Ajax | Architecture | ASP.NET | BizTalk | C# | Certification | Data | DataGrid | DataSet | Debugger | DotNetNuke | Events | GridView | IIS | Indigo | JavaScript | Mobile | Mono | Patterns and Practices | Performance | Podcast | Refactor | Regex | Security | Sharepoint | Silverlight | Smart Client Applications | Software | SQL | VB.NET | Visual Studio | W3 | WCF | WinFx | WPF | WSE | XAML | XLinq | XML | XSD