c# - jQuery のドラッグ アンド ドロップ可能なコール MVC アクション

Question

アイテムのドラッグ アンド ドロップを MVC アプリケーションに実装しようとしています。ここdivから別のアプリケーションにドラッグします。divこれdivにより、post イベントが呼び出され、data-id.

私はjQueryコーディングに比較的慣れていないので、非常にばかげたものを見落としている可能性があります...

コード

<div id="column1" style="width: 400px; background-color: rgba(255, 0, 0, 1)">
    <ul style="list-style-type: none;">
        <li data-id="1">
            <a href="#">
                <img src="http://placehold.it/200x200" />
            </a>
        </li>
    </ul>
</div>
<div id="column2" style="width: 400px; background-color: black">
    <ul>
        <li>
            <a href="#">
                <img src="http://placehold.it/200x200" />
            </a>
        </li>
    </ul>
</div>
<script>
    $("#column li").draggable({
        revert: true,
        drag: function () {
            $(this).addClass("active");
            var a = $(this).closest("#column").addClass("active");
        },
        stop: function () {
            $(this).removeClass("active").closest("#column1").removeClass("active");
        }
    });
</script>

上記は正常に機能し、ドラッグしますが、私の問題はドロップにあります。ドロップを受け入れる必要がある ID を持つものはColumnすべて、ドロップのために上記を複製しようとしましたが、アラートも表示されません...

$("#column").droppable({
    tolerance: "touch",
    drop: function (event, ui) {
        alert('Hello World');
        var targetColumn = $(this),
            move = ui.draggable,
            itemId = move.attr("data-id");
        $.post("Controller/Action", { id: itemId, obj: move });
    }

});

何かアドバイス？

ありがとう。