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(); }
});

したがって、ここでの使用例は、ユーザーがステップを available-steps からレシピ ステップにドラッグできることです。