0

Windows エクスプローラーでファイルをフォルダーにドラッグするのと少し似ています。

これをサポートする無料のjQueryベースのツリービューとその方法を誰かが推奨できますか. これまで jQuery のドラッグ アンド ドロップを行ったことがないので、何に注意すればよいかわかりません。内部でドラッグ ドロップをサポートするウィジェットはたくさんありますが、それが他のページ要素に拡張されているかどうかはわかりません。

ノードが静的であるため、私のツリービューはサーバー側でロードできます。サーバーサイドに MVC4 を使用しています。

4

2 に答える 2

0

MVC プロジェクトにも同じ機能があります。kendoUIを使ってみてください。ドラッグ アンド ドロップ機能を備えたツリービュー コントロールがあります。

于 2013-05-30T03:25:09.013 に答える
0

最終的にjstreeを使用しました。それは私が必要とするすべてを行います。ドキュメントに従うのは難しいですが、私には多くのユーザーがいます。

基本的に、tr (または任意の外部要素) をツリー ノードにドラッグ可能にするには、要素に class="jstree-draggable" を設定するだけです。ツリー ビューは次のように初期化されます。

$("#projectTree").jstree({

    "plugins": ["themes", "html_data", "ui", "hotkeys", "dnd", "crrm"],
    "animation": 100,
    "ui": {
        "select_limit": 1
    },
    // this is the only way I could find to prevent nodes from being dragged.
    "crrm": {
        "move": {
            "check_move": function (m) {
                return false;
            }
        }
    },
    "dnd": {
        "drag_check": function (data) {
            // foreign object
            var cell = $(data.o);
            var row = cell.closest("tr");
            // get the list of valid folders this row can be moved to
            var canMoveTo = row.data("canmoveto");

            // get the folder type 
            var moveToStatus = $(data.r).data("applicationstatus");

            if (canMoveTo.indexOf(moveToStatus) == -1)
                return { after: false, before: false, inside: false };
            else
                return { after: false, before: false, inside: true };
        },
        "drag_finish": function (data) {
            // from foreign object
            var cell = $(data.o);
            var row = cell.closest("tr");

            // to the hovered node
            var moveToStatus = $(data.r).data("applicationstatus");

            moveRowToStatusFolderConfirm(row, moveToStatus);

            //alert("drag_finish");
            return true;
        }
    }
});
于 2013-06-02T06:29:44.793 に答える