Feather's sfDragDrop is a directive that adds drag-and-drop functionality to an HTML element. Using this directive you can drag one or several files over a specified HTML element. When a drop event occurs a delegate is called. The sfDragDrop directive is defined in a module with the same name: sfDragDrop.
The sfDragDrop directive exposes the following attributes:
The sfDragDrop directive adds the following CSS classes to the HTML host element:
The following example demonstrates how to add a drag-and-drop directive in a widget designer's view.
To enable AngularJs to link the sfDragDrop directive in your custom designer view, you must load the script of the directive and add a dependency to the module.
Perform the following:
The code above is called when a drop event occurs. As a result, an alert displays the name of the first file that was dropped in the HTML element hosting the sfDragDrop directive.
Back To Top