Simple Drag and Drop in ExtJS - Quick Example

Quick Example

Below are two screenshots of an example program. The first shows the state of the program initially. The small panel within the DragZone panel is our dragable widget. The beforeRender listener of this widget contains a single line of code:

component.setTitle(component.getId());

The widget is dragged over to the Valid Drop Zone panel and the clone of the original widget is added to the panel. Voila!