2011-05-24 25 views
7

我們使用jsTree來表示文件和文件夾。文件和文件夾可以從其他文件夾移入和移出。jstree中的dnd插件中的拖放事件沒有被調用

爲此,我啓用了拖放式插件。可以拖放文件夾和文件,但拖放時調用的事件不會被調用。

我需要這些事件來進行拖放操作,因爲我需要使用Ajax更新後端拖放的狀態。

請幫忙

下面是代碼。

<script type="text/javascript" class="source"> 

$(function() { 

     $("#folderTree").jstree({ 
     "dnd" : { 
      "drop_finish" : function() { 
       alert("DROP"); 
      }, 
      "drag_check" : function (data) { 
       if(data.r.attr("id") == "phtml_1") { 
        return false; 
       } 
       return { 
        after : false, 
        before : false, 
        inside : true 
       }; 

       alert("hhh jjj kk "); 
      }, 
      "drag_finish" : function() { 
       alert("DRAG OK"); 
      } 
     }, 

     "plugins" : [ "core", "html_data", "themes", "ui","dnd"], 

     "ui" : { 
      "initially_select" : [ "phtml_1" ] 
     }, 

     "core" : { "initially_open" : [ "phtml_1" ] }, 

     "themes" : { 
       "theme" : "apple" 
     }, 

     "types" : { 
      "valid_children" : [ "root" ], 
      "types" : { 
       "root" : { 
        "icon" : { 
         "image" : "../images/drive.png" 
        }, 
        "valid_children" : [ "folder" ], 
        "draggable" : false 
       }, 
       "default" : { 
        "deletable" : false, 
        "renameable" : false 
       }, 

       "folder" : { 
        "valid_children" : [ "file" ], 
        "max_children" : 3 
       }, 
       "file" : { 
        // the following three rules basically do the same 
        "valid_children" : "none", 
        "max_children" : 0, 
        "max_depth" : 0, 
        "icon" : { 
         "image" : "../images/file.png" 
        } 
       } 

      } 
     } 



    }); 
}); 

我失去了什麼或有什麼事我需要爲了做拖放事件被調用?

回答

2

如果要拖動樹中的節點,應該使用CRRM plugin而不是DND。 DND用於在樹之外或樹之間拖動節點。

+0

感謝您的回覆。使用CRRM插件,我可以在樹內拖放節點嗎?我不想有任何按鈕來執行這些文件和文件夾的移動。 – ashishjmeshram 2011-05-24 05:56:09

+0

我這種情況下你需要一起使用它們。看看該演示和代碼http://www.jstree.com/documentation/dnd#demo2。 – bjornd 2011-05-24 06:01:24

6

使用此URL檢查Issue with JSTree drag drop 使用class =「jstree-drop」以及所有節點的ID。它會工作。 例如: - 如果使用JSON數據

"plugins" : [ "core", "json_data", "themes", "ui","dnd"], 
{ 
    {id : "id1",rel : "folder",class:"jstree-drop"}, 
    data:"New folder2", 
    state:"closed" 
} 

,如果我們使用的HTML數據,然後添加類=「jstree降」到所有節點。 然後「drop_finish」事件將正常工作,但不是drag_check,drag_finish。我嘗試通過在CSS類中添加jstree拖動。

更新(在19月2011年一小時後): - 增加jstree,可拖動 CSS類的所有元素拖動事件也能正常工作 更多信息http://www.jstree.com/documentation/dnd

1

選項dnd.drag_checkdnd.drag_finishdnd.drop_finish是用途對於異物。要管理在一棵樹內(或樹木之間)移動,請使用crrm.move.check_move