kendo-ui - Kendo Draggable 和 DropTarget 不起作用

Question

我试图让用户将列表项拖到另一个未排序的列表中。我可以“拾取”列表项，因此 Draggable 似乎可以工作，但是当我将它们释放到 DropTarget 上方时，它们不会被添加。我添加了一些事件来检查 Draggable 和 DropTarget 是否都已正确初始化，并且看起来它们是正确的。

HTML：

<ul id="recipe-steps">
    <li>Step 1</li>
    <li>Step 2</li>
    <li>Step 3</li>
</ul>
<ul id="available-steps">
    <li>Step 1</li>
    <li>Step 2</li>
    <li>Step 3</li>
</ul>

DropTarget JS代码：

$("#recipe-steps").kendoDropTarget({
    dragleave: function (e) {
        e.draggable.hint.css("opacity", 1);
    },
    dragenter: function (e) {
        e.draggable.hint.css("opacity", 0.3);
    }
});

可拖动的JS代码：

$("#available-steps").kendoDraggable({
    filter: "li",
    ignore: "input",
    hint: function(element) { return element.clone(); }
});

所以这里的用例是用户可以将一个步骤从可用步骤拖到配方步骤。