A frequently overlooked and underused feature of Dojo’s Drag-and-Drop (DnD) module is drag handles.

DnD is commonly implemented as a set of draggable elements where the entire DnD item (usually a subtree of DOM nodes) can detect the drag action. In some cases, this is not desirable:

• DnD items that contain active elements: links, text areas, buttons, check boxes, other common form elements. The drag action can prevent normal interactions with them, e.g., text selection inside text boxes.
• Large DnD items that occupy most of screen. Frequently these items have collapsed and expanded states, and should not be dragged while expanded.

(more…)

Most anyone who’s looked at the feature list knows that one of Dojo’s core features is a drag and drop framework. What’s not immediately obvious is that Dojo actually has two drag and drop APIs. The first, dojo.dnd, is designed to manage the process of dragging items between two or more containers, including multiple selection, item acceptance filtering on drop targets, and other behavioral tweaks. The second API, dojo.dnd.move, is a bit lower-level in scope; it’s designed to manage the process of moving single objects around, without the concept of attaching items to containers. Both of these are very useful features to have at your disposal. In this article, we’ll cover dojo.dnd.

(more…)