Bahdeng Bahdeng - 7 months ago 44
Javascript Question

Dynatree does not reload with new nodes programatically

I am loading the dynatree programitically when the page loads as follows

function loadTree(data)
{
var rootNode = $("#tree").dynatree("getRoot");
$.each(data, function () {
var childNode = rootNode.addChild({
title: this.agent_code + ' - ' + this.holder_name,
tooltip: this.holder_name,
isFolder: true,
key:this.agent_code,
});
});
}


Now after i retrieve new data from the server and wants to load with new nodes it does not remove the old node.

function reload(data)
{
$("#tree").dynatree("getRoot").visit(function(node){
node.remove();
});
loadTree(data)
}


The above code removes only a single node. What am i missing here.
Thanks in advance

UPDATE
i tried with a workaround through the following code

function reload(data)
{
$("#tree").remove();
$('#test').html('<div id="tree"></div>');
$('#tree').dynatree(); //reinitialize the tree
loadTree(data);
}


It does reload but then cannot populate the child nodes through lazyloading

Answer

This will remove all the nodes that you have added during the initial load:

$("#tree").dynatree("getRoot").removeChildren();
Comments