Pattern: Using Drag&Drop in a web page

Pattern: Using Drag&Drop in a web page

  
The attached eSpace is a small pattern that uses a drag & drop interface to order a set of database items.

The important objects and concepts in this pattern are:
- The image to be dragged. Pay attention to its extended properties.
- The drop zone (the cell that includes the image). Pay attention to its extended properties also.
- The entry point used by the web screen javascript when handling the drag operation.
- The items' order attribute. It is not sequencial but rather a multiple of 2. This allows to place items between 2 positions.
- The screen preparation that handles the drop event and also updates each item order when needed.

Feel free to use this pattern as you wish. If you have any doubts or suggestions, please drop me a note.