Populate jstree parent nodes dynamically

Question

I have a jstree in which I need to populate the data dynamically..In the code below I'm trying to populate the parent nodes dynamically..

function populateJsTree(response) {
            for (i = 0; i < response.length; i++) { //this has list of parent nodes//eg:Parent1,Parent2,etc.,
                var parent = response[i];
                alert(parent.ParentNodeName); // successfully getting parentnode names..
                $('#FolderTreeId').jstree({
                    'core': {
                        'data': [
                                        {
                                            'text': parent.ParentNodeName,
                                            'state': {
                                                'opened': false,
                                                'selected': false
                                            }//,
                                            //'children': 
                                        }
                                ]
                    }
                }); 
            }

I know I'm going wrong in many places here, but this above code gets me only one parent node in jstree i.e, Parent1.. Help me know how to correctly get all parent nodes in my jstree... Thank you..

Answer 1

In your code you are trying to create a new tree for each element in your array. Instead try this:

function populateJsTree(response) {
    var nodes = [], i;
    for (i = 0; i < response.length; i++) {
        nodes.push(response[i].ParentNodeName);
    }
    $('#FolderTreeId').jstree({
        'core': {
            'data': nodes
        }
    });
}