拖放后如何保存新的Jstree

Question

我的jstree数据具有以下配置：

config_collection = 
[
    {
        id: "1"
        parent: "#"
        text: "First Question"
    },
    {
        id: "1.1"
        parent: "1"
        text: "First Answer"
    },
    {
        id: "1.2"
        parent: "1"
        text: "Second Answer"
    }
]

我的Jstree设置是：

$("#jstree_div").jstree({
    'core' : {
        'data' : config_collection,
        'check_callback' : true,
        'multiple' : false
    },
    'plugins' : [ 'dnd' ]
});

jstree可以正确加载并具有所有基本功能，直到我拖放为止。我的实际树更为复杂，但假设我想切换第一个和第二个答案。我可以使用拖放来做到这一点，但是当我保存并重新加载时，我的任何更改都无法保留。我目前正在尝试在更改受影响的每个节点的ID所需的所有功能中进行编码，但这很快就变得非常毛。除了编码该功能外，是否有任何选择可以让我保留这些更改？Jstree内置的任何东西？

Answer 1

jstree简单地使用

var config_collection =  $('#ul_list_id_is_here').jstree(true).get_json('#', {flat:true});

如果您想从Li结构Fallow指令中创建JSON，则有不同的侵犯

将您的JSON数据更改为

config_collection = 
[
    {
        id: "1"
        parent: "#"
        text: "First Question",
        li_attr:{
           "data-parent" : "#"
        }
    },
    {
        id: "1.1"
        parent: "1"
        text: "First Answer",
        li_attr:{
           "data-parent" : "1"
        }
    },
    {
        id: "1.2"
        parent: "1"
        text: "Second Answer",
        li_attr:{
           "data-parent" : "1"
        }
    }
]

这会将数据 - 父母属性添加到Li并致电buildjson（）创建li结构为json

    var buildJson = function (root){
        if(!root){
            root='#ul_list_id_is_here';
        }
        var  result = [];
        // get first deepth of li list
        $('ol:first > li',root).each(function() {
            var itemdata = {};
//if you want to collect all attribute of li tag then use here 
//          $.each($(this).data(), function(key, value) {
//              itemdata[key] = value;
//          });
            itemdata["id"]      = $(this).attr('id');
            itemdata["parent"]  = $(this).attr('data-parent');
            itemdata["text"]    = $(this).text();
            // check li does have children 
            if($(this).children("ol").length){
                if($(this).find("ol li").length){
                    itemdata["children"] = buildJson($(this));
                }
            }
            result.push(itemdata);
        });
     return result;
    }
console.log(buildJson());