複数のコンテナでDragulaを使用しますが、コンテナにのみアイテムを限定します。

Question

複数のドラッグコンテナがあるページがあります。コンテナはulのもので、束はliです。ユーザーがコンテナにliを並べ替えることができるようにしたいと思いますが、あるコンテナのliを別のコンテナにドラッグ可能にしたくありません。今すぐすべてliをulにドラッグできます。 liを元のコンテナにのみ制限するにはどうすればよいですか？

HTML：

<ul id="first"> 
    <li>for first group only</li> 
    <li>for first group only</li> 
    <li>for first group only</li> 
</ul> 

<ul id="second"> 
    <li>for second group only</li> 
    <li>for second group only</li> 
    <li>for second group only</li> 
</ul> 

<ul id="third"> 
    <li>for third group only</li> 
    <li>for third group only</li> 
    <li>for third group only</li> 
</ul> 

JS：

var first = '#first'; 
var second = '#second'; 
var third = '#third'; 

var containers = [ 
    document.querySelector(first), 
    document.querySelector(second), 
    document.querySelector(third) 
]; 

dragula({ 
    containers: containers, 
    revertOnSpill: true, 
    direction: 'vertical' 
}); 

はありがとうは

Answer 1

あなたは要素は、それがどこから来た同じコンテナにドラッグされていることを確認しoptions.accepts方法を指定することができます。例えば

：

JS：

dragula({ 
    containers: containers, 
    revertOnSpill: true, 
    direction: 'vertical', 

    accepts: function (el, target, source, sibling) { 
     // accept drags only if the drop target is the same 
     // as the source container the element came from 
     return target == source; 
    } 
});