Dragula Copy and removeOnSpill

Question

I'm trying to use the Dragula Drag & Drop library to Clone elements into a target container AND allow the user to remove cloned elements from the Target Container by drag & dropping them outside of the target container (spilling).

Using the examples provided I have this:

dragula([$('left-copy-1tomany'), $('right-copy-1tomany')], {
   copy: function (el, source) {
      return source === $('left-copy-1tomany');
   },
   accepts: function (el, target) {
      return target !== $('left-copy-1tomany');
   } 
});
dragula([$('right-copy-1tomany')], { removeOnSpill: true });

Which does not work - it seems that 'removeOnSpill' simply doesn't work if the container accepts a copy.

Does anybody know what I am not doing, doing wrong or if there is a work-around?

TIA!

Answer 1

I came here after looking for a while for a solution to a similar issue using the ng2-dragula for angular2.

    dragulaService.setOptions('wallet-bag', {
  removeOnSpill: (el: Element, source: Element): boolean => {
    return source.id === 'wallet';
  },
  copySortSource: false,
  copy: (el: Element, source: Element): boolean => {
    return source.id !== 'wallet';
  },
  accepts: (el: Element, target: Element, source: Element, sibling: Element): boolean => {
    return !el.contains(target) && target.id === 'wallet';
  }
});

I've got 4 divs that can all drag into one which has the id of wallet They are all part of the wallet-bag using this code, they can all copy into the wallet, not copy between each other, and you can remove them from the wallet using the spill but not from the others.

I'm posting my solution as it may also help someone.