雙擊以編輯節點，然后使用jstree重命名

Question

我設置了一個jstree（在div id =“ surveyManager”上）。 我已經將dbclick和重命名功能綁定到它，如下所示：

 .bind("rename.jstree", function (node, data) {
            edit_node(node,data);
}),

.bind("dblclick.jstree", function (event) {
            //Double Click to Rename
                    jQuery("#surveyManager").jstree("rename");
    })

在這里edit_node是必須實現以通過ajax調用傳遞所有節點信息的功能。

是否可以設置樹，這樣在dbclick上，而不是重命名節點，我只需觸發edit_node（node，data）即可。 也許另一個jstree函數，或者我可以在其他地方定義它。 請幫忙

Answer 1

對於任何人閱讀此答案。 我不知道這個答案是否適用於舊的jstree或其他東西，但是對我來說不起作用。 我在此jsfiddle上實現了單擊“編輯”。

這是起作用的代碼：

 $('#jstree_demo_div2') // listen for event .on('select_node.jstree', function (e, data) { var node = data.instance.get_node(data.selected[0]); data.instance.edit(node); }); 

Answer 2

我在這里回答我自己的問題，我通過嘗試其他一些事情來弄清楚了。 除了雙擊具有用於編輯的重命名功能外，我們幾乎可以擁有一個select_node和edit項。

傳遞的參數是事件和數據。 我們可以使用event.target來獲取節點信息，並且已經提供了數據，從而使我們能夠簡單地調用其他函數。

.bind("select_node.jstree", function (e,data) {
    var node = $(e.target).closest("li");
       edit_node(node,data);
   });

謝謝您的幫助

Answer 3

我不確定我是否理解您的問題，但是如果您想雙擊以重命名，請嘗試：

    tree.off('dblclick').on('dblclick','.jstree-anchor', renameNode);               

    function renameNode() {
        var instance = $.jstree.reference(this),
        node = instance.get_node(this);
        var old = node.text.replace(/\s+$/, ''); // trim right spaces

        inst.edit(node, null, function(node, success, cancelled) {
            if (!success || cancelled) return;
            if (node.text.replace(/\s+$/, '')==old) return;

            // all good, your rename code here
        });
    }

需要.off（'dblclick'）來防止doubleclick上的默認jstree打開節點

請注意，如果還將樹“ click”事件綁定到某處，也會觸發dblclick。 將'click'更改為'singleclick'並使用jquery.singleclick.js

Answer 4

您可以使用jQuery'a 觸發方法來觸發已定義的事件。

這可以在下面實現。

.bind("rename.jstree", function (node, data) {
  edit_node(node,data);
}),

.bind("dblclick.jstree", function (event) {
  //Double Click to Rename
  //jQuery("#surveyManager").jstree("rename");
  jQuery.trigger("rename.jstree");
})