Use ASP. Net Atlas to achieve the drag & drop effect (on)

Http://dflying.dflying.net/1/archive/77_atlas_drag__drop_overview.html
Http://dflying.cnblogs.com/archive/2006/04/21/381763.html
See also: use ASP. NET atlas for drag-and-drop effects (below)

Digress

This English version is posted by me at my english blog http://dflying.dflying.net for more that two months. So some of the features may be out of date now, such as the oldWebNamespace and the Demo code. I may update it in the coming days but at this moment for English readers, please just be a little patient.

This articleArticleThe English version was published in my English more than two months ago.Blog:Http://dflying.dflying.net. So now some of the content is outdated, for example,Web"Naming controls and accompanying examplesProgram. I will try to update it later, but please be patient.

This article was once written by Wu Fei(Felix)Thank you for translating it into Chinese! For his or her version, see:Http://www.felixwoo.com/article.asp? Id = 171

Body

ASP. NET AtlasIt provides an easy-to-use and powerful cross-browser drag-and-drop feature.AtlasThe drag-and-drop functionAtlasuidragdrop. jsIf you are interested in the file, you can learn about its implementation. Of course, this part of content is not within the scope of this article (we will introduce it in the future and hope I will not be lazy ).

Basically,AtlasDrag-and-dropUIIt is implemented in the following two parts:

1. dragging objects and serving target objects . Objects that can be dragged are Dom elements that can be moved by the mouse on the page (such as items in online shopping malls ), the target object can receive the objects that can be dragged on the page, as the Dom element of the container (for example, the shopping cart in an online store ). Atlas allows you to idragsource interface to define your own drag objects, implement the idroptarget interface to define the target object. Of course, you can implement the above two interfaces at the same time (for example, you want the user to freely drag on the page and arrange the location of the shopping cart ).
2. one dragdropmanager Object . dragdropmanager is a global object and will be automatically initialized at runtime (of course, you need to display the declaration reference in scriptmanager atlasuidragdrop script ). You can access it using SYS. UI. dragdropmanager . Its main functions are provided by calling the idragsource and idroptarget interfaces. Start the drag-and-drop operation and register the target object. Generally, you do not need to worry too much about dragdropmanager .

in this way, generally, Atlas creates a drag-and-drop UI has the following two steps:

1. implemented idragsource interface to create objects that can be dragged , objects that implement the idragsource interface should be called dragdropmanager startdragdrop () method to start the drag operation (usually this step should be processed mouse down events ). Each dragging object has its own datatype attribute, it can be used to define drag and drop objects of the same type.
2. implemented idroptarget interface to create the target object , objects that implement the idroptarget interface should be called in dragdropmanager registerdroptarget () Register yourself. Each target object has its own acceptedpes ypes attribute, specifies the type datatype attribute you can drag an object.

In general, the drag-and-drop operation starts with a callable object.DragdropmanagerOfStartdragdrop ()Method, and then,DragdropmanagerTake over other operations, which will callIdragsourceInterface Method and target objectIdroptargetInterface methods to coordinate the relationship between the two and the correspondingUIChange.

AtlasProvides some built-in implementationsIdragsourceAndIdroptargetFor more information about behavior, see create a custom behavior in ASP. NET atlas. Obviously, the following client behavior has implementedIdragsourceOrIdroptargetAt least one of the interfaces.

1. DragdroplistBehaviorYou can add the drag-and-drop function to a group of controls. A typical application isListviewWidget(AboutListview, See: Use the ASP. NET Atlas listview control to display list data)Implement the drag-and-drop function.
2. DraggablelistitemBehaviorYou canDragdroplistDefine a drag object. Can be applied inListviewOfItemtemplateSo that each item in the list can be dragged.
3. DatasourcedroptargetBehaviorUsed to add dataDatasourceControls (aboutDatasourceFor details, see the control introduction under Atlas namespace SYS. Data -- datasource and xmldatasource.
4. FloatingbehaviorBehaviorA widget can be moved on a page.

In the next article, I will use a sample programDemo drag-and-drop (Drag & dropEffect implementation: use ASP. NET Atlas to implement the drag-and-drop effect (lower)