Chapter 12. Dragging and dropping

 

In this chapter:

  • The drag-and-drop engine
  • The IDragSource and IDropTarget interfaces
  • Building a client-centric drag-and-drop shopping cart
  • Building an ASP.NET server-centric drag-and-drop shopping cart

How many times a day do you move files from one folder to another, between windows, or even directly into the recycle bin, using only your mouse and one of your fingers? Every time you perform these actions, you complete a drag-and-drop operation, which is the visual representation of a set of commands. For example, if you move (or drag) a file icon from your desktop and release (drop) it over the recycle-bin icon, you’re visually “throwing away” the file and marking it for deletion (but remember to restore it if you aren’t going to delete it!).

Drag and drop is a powerful mechanism that enhances UIs. The introduction of the browser’s DOM gave JavaScript developers a chance to implement drag and drop in web pages using CSS and dynamic HTML.

In this chapter, we’ll analyze the drag-and-drop engine included in the ASP.NET Futures package. Your goal is to master the client classes used to add drag-and-drop capabilities to DOM elements of web pages. By the end of the chapter, you’ll have the skills to develop a drag-and-drop shopping cart using both the client-centric and the server-centric development models. As part of the ASP.NET Futures package, the features illustrated in this chapter aren’t currently documented or supported by Microsoft.

12.1. The drag-and-drop engine

12.2. A drag-and-drop shopping cart

12.3. Summary