Dynamically decide whether element is draggable / droppable

[tpraxl]

I'm currently trying to implement the following use case:

• As a user, I want to select items from the catalogue and add them to a list of distinct items.
• In order to keep the hierarchical structure of the catalogue, I do not want catalogue items to disappear after I have dragged them away. Instead, I want them to be cloned into the new list.
• In order to prevent duplicate items in the list of distinct items, I expect that I'm not able to drag an item from the catalogue if it is already contained in the list of distinct items.
• If this is not possbile, I would expect that dropping a duplicate item is prevented.

I couldn't find a solution yet – maybe I have missed something. Tried to return false in practically every callback function, e.g. onAdd, onChoose, onMove.

Returning false in onMove has an effect, but it only works when sorting items in the target list, it does not prevent dropping items there from another list.

So I also tried to define functions for group put and pull of the respecting groups.

E.g.:

 group: { 
    ///...
    pull: function(e){
        // problem: e provides no information about the list-item to be dragged, only the parent list in e.el
        if(pullAllowed(e)){
            return 'clone';
        }else{
            return false;
        }
    }
}

But I'm only able to gather informations about the parent list from the event object. I would need to identify the item to be dragged in order to decide whether it is allowed to drag it or not.

Does anyone have any hint about how to handle this?

[RubaXa]

https://github.com/RubaXa/Sortable/issues/1037 — ?

[tpraxl]

Thanks for the fast reply, but that doesn't match my usecase as far as I can see.

I need to be able to decide if dragging is allowed, based on the element to drag, not based on the list to drag from. The element may only be present once in the target list.

[RubaXa]

Then I have no idea how to help you.

[tpraxl]

Oh.. how sad.. It's a shame that I can't use sortablejs then. It's nice work.

Well. Thanks anyway for your efforts.

[RubaXa]

Wait, why are onMove is not suitable? http://jsbin.com/jeracer/edit?html,js,output

[tpraxl]

Hey! That's it!

It's not perfect, because I would have preferred to disallow the dragging and not the dropping, but it's the second best approach.

Thank you very much RubaXa! Great.

[RubaXa]

A little imagination and can so: http://jsbin.com/jeracer/edit?html,js,output

[tpraxl]

Great. Thank you very much.

[josealonso]

Wait, why are onMove is not suitable? http://jsbin.com/jeracer/edit?html,js,output

A little imagination and can so: http://jsbin.com/jeracer/edit?html,js,output

Many thanks, RubaXa !! That's exactly what I was looking for.

[vedmant]

This works if all JS code is in one component, in my case I have sortable elements in different components and they don't share the same list property. Is there a method like onMove but called on target sortable?