存储重命名 JS.Tree 节点的结果

Question

我有一个 editable 树结构。用户可以创建、重命名和删除单个节点。现在，当我选择要重命名的节点时，我使用此代码将原始值存储在变量中。

        function rename() {
            var data = null;
        data = $(plBox2).jstree().get_selected(true)[0].text;
        console.log(data);
        }

当在上下文菜单中选择 "Rename" 时调用此函数。我想做的是在重命名后存储该节点的新值，但我无法弄清楚。我的最终目标是将旧值和新值都发送到 MySQL table.

这是我的树和上下文菜单：

$('#plBox2').jstree({
                "checkbox": {
                "keep_selected_style": false
                },
                "core" : {
                    "themes": {
                        "name": "default",
                        "dots": true,
                        "icons": true,
                    },
                    "check_callback": true,
                },                  
                "plugins" : [ 
                        "massload", "wholerow", "contextmenu", "changed", "sort", "dnd",
                ],

                "contextmenu":{         
                    "items": function($node) {
                        var tree = $("#plBox2").jstree(true);
                        return {
                            "Info": {
                                "separator_before": false,
                                "separator_after": false,
                                "label": "Info",
                                "action": function (obj) { document.getElementById('finInfo').style.display='block';
                                }
                            },
                            "Create": {
                                "separator_before": false,
                                "separator_after": false,
                                "label": "Create",
                                "action": function (data) {
                                    var inst = $.jstree.reference(data.reference),
                                    obj = inst.get_node(data.reference);
                                    inst.create_node(obj, {}, "last", function (new_node) {
                                    new_node.data = {file: true};
                                    setTimeout(function () { inst.edit(new_node); },0);
                                    });
                                }
                            },
                            "Rename": {
                                "separator_before": false,
                                "separator_after": false,
                                "label": "Rename",
                                "action": function (obj) { 
                                    tree.edit($node);
                                    rename();
                            }
                        },                         
                            "Remove": {
                                "separator_before": false,
                                "separator_after": false,
                                "label": "Remove",
                                "action": function (obj) { 
                                    tree.delete_node($node);
                                }
                            }
                        };
                    }
                },

HTML:

<div class="2colWrap">
            <div class="col1">
                <div id="plBox2"></div>

            </div>
            <div class="col2">
                <div id="finishBox"></div>
            </div>
        </div>

谢谢！

Answer 1

您可以使用下面的语句！

                 "Rename": {
                        "separator_before": false,
                        "separator_after": false,
                        "label": "Rename",
                        "action": function (obj) {
                            console.log("waht?");
                            currentNode = $node;
                            //tree.edit($node);
                            tree.edit('j1_1', null, function (node, status) {
                                debugger;
                                console.log("old name: " + node.original.text);
                                console.log("new: " + node.text);
                                console.log(arguments);
                            });

                        }
                    },

存储重命名 JS.Tree 节点的结果

Store Result of Renamed JS.Tree Node

javascript

jstree