As we've seen previously, there are a couple of components that offer drag-and-drop support completely out of the box. It's important to remember that these features exist. Given our new drag-and-drop knowledge, we could implement them from scratch. Instead, we'll quickly review the main Ext components that have this facility baked in.
The default Ext.TreePanel
not only enables drag-and-drop via the provided configuration option, but exposes a number of events, such as beforenodedrop
, that allow us to hook our own functionality into the component.
By using AJAX requests, we can persist the results of our drag-and-drop actions to the server for retrieval later. If you're using multiple TreePanels
, you can even drag-and-drop between them, and restrict the direction of movement using the enableDrag
and enableDrop
configuration options.