I have this functionality in a file manager, but since that's "always
under construction" I never find time to finish it, and put it online
(like on forge or github).. if still needed I can copy/paste some code
tonight...basically it has items that can be droppable, draggable or
both etc.

You can also check out cpojer's file manager I think, as it has
elements also acting as folders that you can drag and drop on.
http://www.mootools.net/forge/p/mootools_filemanager

If you still can't get it to work, post it here

On Aug 31, 10:49 am, "[email protected]" <[email protected]>
wrote:
> hi there!
>
> is there a way (plugin or something) to combine sortables with
> droppables? my setup is as follows: a container-div with several
> items , declared as sortables. as soon as i drag an item, this is
> declared as drag.move element and the others as droppables. but it
> doesnt work. i didnt find function in the framework for sorting and
> grouping entries by dragging them on each other, so i hope for help.
> code:
>
> html:
>
> <div id="tasks_wrapper">
>     <div class="task"><h1>1</h1></div>
>     <div class="task"><h1>2</h1></div>
>     <div class="task"><h1>3</h1></div>
>     <div class="task"><h1>4</h1></div>
>     <div class="task"><h1>5</h1></div>
> </div>
>
> js:
>
> var taskSortables = new Sortables('#tasks_wrapper', {
>                         clone: true,
>                         revert: true,
>                         snap: 10,
>                         onStart : function(element, clone) {
>
>                                 var myDrag = new Drag.Move(element, {
>
>                                         droppables: '.task',
>
>                                         onDrop: function(element, droppable, 
> event){
>                                                 if (!droppable) 
> console.log(element, ' dropped on nothing');
>                                                 else console.log(element, 
> 'dropped on', droppable, 'event',
> event);
>                                         },
>
>                                         onEnter: function(element, droppable){
>                                                 console.log(element, 
> 'entered', droppable);
>                                         },
>
>                                         onLeave: function(element, droppable){
>                                                 console.log(element, 'left', 
> droppable);
>                                         }
>
>                                 });
>
>                         },
>                         onComplete : function(element, clone) {
>                                 //
>                         }
>
>                 });

Reply via email to