Drag and Drop

ICEfaces includes support for dragging and dropping components using the script.aculo.us library. Any ice:panelGroup instance can be set to be draggable or a drop target.

For example, to make a panelGroup draggable, set the draggable attribute to true.

<ice:panelGroup draggable="true">
 

The panel group (and all of its child components) can now be dragged around the screen.

Any panelGroup can be set to a drop target as well by setting the dropTarget attribute to true.

<ice:panelGroup dropTarget="true"> 
 

When a draggable panel is moved over or dropped on the drop target panel, events can be fired to the backing beans. These events include Drag Start, Drag Cancel, Hover Start, Hover End, and Dropped.

Figure 10 Drag and Drop Concept

Draggable panels can optionally have animation effects that modify their behavior and appearance panels. Table 2 lists these optional effects and their behavior.

Table 2   Drag and Drop Effects

Effect	Behavior
revert	When a panel is dropped, it moves back to its starting position.
ghosting	A ghost copy of the drag panel remains at its original location during dragging.
solid	No transparency is set during dragging.

See Creating Drag and Drop Features for details on how to build drag and drop applications.

Copyright 2005-2009. ICEsoft Technologies, Inc.