jstree 动态增加节点问题

[SavantStart]

最近再做一个项目需要用到jstree来做树形展示，在进行动态添加子节点的时候，jstree，那个create_node.jstree事件，一点击就异步到后台，但是此时的node名称还没有修改，修改node名称之后，回车就触发rename_node事件，那么问题来了，此时jstree自动生成的节点id是随机生成的，跟我数据中要的id不一样，这时我就在create_node事件中做回调，得到后天返回的节点id，然后用$(data.node.attr("id",后台返回的id))，给他换了，然后就出问题了，数据库中可以修改成功，但是前提会失败，刷新之后才正常显示，研究了很久，也没出来，请懂jstree的大师，指教一下 啊。

代码如下：

var UITree = function () {

    var contextualMenuSample = function() {
        $.jstree.destroy ("#tree_3");
        $('#tree_3').jstree({
            "core" : {
                "themes": {
                    "responsive": false
                },
                "check_callback": true,
                "force_text": true,
                "cache": false,
                'state':open,
                'data': {
                    "url": function() {
                        return  "/authority/showOnlyTheme";
                    },
                    "data":function(node){
                        return {"id" : node.id};
                    }
                }
            },
                "plugins": [ "contextmenu", "ui"]
            /*'contextmenu':{
                'items':{
                    'edit':null
                }
            }*/

        }).bind("loaded.jstree", function () {
            jQuery("#tree_3").jstree("open_all");
        }).bind("create_node.jstree",function(event,data){
            createCategory(event,data);
        }).bind("rename_node.jstree",function(event,data){
            rename(event,data);
        }).bind("delete_node.jstree",function(event,data){
            reMove(event,data);
        })
    }


    return {
        init: function () {

            contextualMenuSample();

        }

    };

    function createCategory(event,data){
        var str = data.parent;
        var parentId =  str.substring(1);;
        if(!str.match(/^c\d+/g)){
            parentId = -1;
        }
        var newNodeName = data.node.text;
        var params = {"parentId":parentId,"name":newNodeName,"rootId":parentId};
        $.ajax({
            'url':"/categoryManager/addOrUpdate",
            'type':"post",
            'dataType':'json',
            'cache':false,
            'data':params,
            'timeout':1000*10
        }).done(function(json){
            var id = data.node.id;
            var categoryId = json.data;
            $(data.node).attr("id",categoryId);//此处修改成后台返回的id
        }).fail(function(e){
            Metronic.unblockUI();
            alert("亲出错了，请稍后再试");
        })
    }

    function rename(event,data) {
        var str = data.node.id;
        if(str.match("#")) {
            alert("不能修改根节点");
            return;
        }
        var id = str.substring(1);
        var name = data.text;
        var params = {"id":id,"name":name};
        $.ajax({
            'url':'/categoryManager/updateName',
            'type':'post',
            'dataType':'json',
            'data':params,
            'cache':false,
            'timeout':1000*10
        }).fail(function(){
            Metronic.unblockUI();
            alert("亲出错了，请稍后再试~");
        })
    }

    function reMove(event,data) {
        var str = data.node.id;
        if(str.match("#")) {
            alert("亲，不能删除根节点");
            return ;
        }
        var id = str.substring(1);
        var params = {"id":id};
        $.ajax({
            'url':"/categoryManager/del",
            'type':"post",
            'dataType':"json",
            'data':params,
            'cache':false,
            'timeout':1000*10
        }).done(function(json){
            if(json.ret==false) {
                alert(json.errmsg);
            }
        }).fail(function(json){
            Metronic.unblockUI();
            alert("亲出错了，请稍后再试~");
        })

    }





}();

[SavantStart]

没人啊，都玩去了吗啊

[孟子E章]

创建节点，一般都是ajax执行，不刷新页面的。 官网的demo https://www.jstree.com/demo/

[重拾jA]

你好 最近也在研究jstree，想请教一下 有没有直接新建node并且编辑了正确的nodename之后，才触发的方法

[wwei466]

楼主找到解决方案了吗

[dtrink1]

可以参考一下这个思路，重新加载jstree架构 https://www.ip21.cn/2016/04/jstree更改内容后仅刷新jstree的dom结构/

[hsj1213522415]

请问楼主解决了吗，同样遇到这个问题

[jdong001]

我也遇到了类似问题，jstree版本为3.3.3，在返回json数据时增加“response.setContentType("application/json; charset=utf-8");”可以解决此问题。