tarzanbappa tarzanbappa - 3 months ago 146
Javascript Question

Refresh Bootstrap Treeview programatically

I have a Bootstrap tree view which binds to a json array..

$('#tree').treeview({data: data,
onNodeSelected: function(event, data) {

$m.nodeSelected(event,data);
}});


And the array that binded to the treeview is..

var data = [
{
"text": "Parent1",
"selectable": "false",
"nodeType": "main",
"nodes": [
{
"text": "Child1",
"typeId": "aa2d4ea9-bfad-4a5b-8794-994e7e482808",
"nodeType": "sub"
},
{
"text": "Child2",
"typeId": "e01bd0cb-c93b-40f9-be44-be67f20668aa",
"nodeType": "sub"
}
]
},
{
"text": "Parent2",
"selectable": "false",
"nodeType": "main",
"nodes": [
{
"text": "Child1",
"typeId": "a0256aa3-b2ef-53d7-1270-a5029e7138ce",
"nodeType": "sub"
}
]
}
]


Here is what I need..

I need to add a new child node / remove a existing child node from the treeview datasource and refresh it.

I've tried but unable to find a solution.

Answer

just call

$('#tree').treeview({data: data,
           onNodeSelected: function(event, data) {

            $m.nodeSelected(event,data);
}});

again when you have changed the datavariable

example: https://jsfiddle.net/k8m911u9/1/