尝试使用新数据重新加载/刷新dynatree

我已经看过这个问题了，我已经尝试了给出的解决方案（使用tree.reload（）），但它对我不起作用。 我有一个使用initAjax（）初始化doc的树，我正在尝试使用不同的值重新加载树，以更改选择输入。 基本上这个：

$(document).ready(function(){ // global variables var myVal = 'initial value'; // initialize tree $('#tree').dynatree({ persist: false, initAjax: { url: 'getMyStuff.cfc', data: { myParam: myVal } }, ... more params )}; // select change handler $('#mySelect).change(function(){ var tree = $('#tree').dynatree('getTree'); myVal = $(this).find('option:selected').val(); tree.reload(); )}; )}; 

问题是树继续使用相同的参数重新加载…我可以在控制台的网络选项卡中看到，每次发送的参数都是相同的，即使我已经确认我的目标是正确的元素，并在变化时得到正确的值。

我试过改变变量的范围，我尝试将dynatree选项放在一个单独的变量中，我试过调用

 $('#tree').children().remove(); $('#tree').dynatree(treeoptions); 

在change（）函数中，我试过调用tree.initialize（）（是的，我知道它是构造函数），我已经尝试过tree.redraw（），我在调用reload之前尝试过单独设置initAjax选项（ ），我被困住了。

有任何想法吗？

此时，我决定唯一要做的就是将树初始化放入函数中，并在更改select选项时，吹走树（包括其父div）并重建它。 如果没有其他方法可以使用新数据重建树，我会感到惊讶，这与我使用其他小部件的经历背道而驰。

Answer 1

这个问题与此重复： 如何重新加载/刷新/重新启动DynaTree？

我的解决方案不需要像det（）和destroy（）那样的弯路等。想一想：创建Dynatree时，您需要指定必须使用的设置字典。 然而，由于这是一个配置字典，它不会被重新评估，即使一些参数是变量并且由于点击等而发生变化。所以为了解决这个问题并避免昂贵的操作，比如删除DOM并重新创建它，我们就像我认为Dynatree开发人员一样有这个意图（但在AJAX / JSON示例中没有明确记录）：

  //The HTML: Checkme
  $("#checkbox").click(function() { $("#mylabel").text($(this).is(":checked")) $("#tree").dynatree("option", "initAjax", { url: "myurl/myphp.php", data: { myparameter: $("#checkbox").is(":checked").toString() } }); $("#tree").dynatree("getTree").reload(); }); 

每次单击按钮时，此示例都会在#tree上设置配置，然后重新加载树。

Answer 2

我在dynatree google小组中找到了这个。 这个对我有用。

 $('.tree').dynatree('destroy'); $('.tree').empty(); 

这是原始链接 。

Answer 3

我想用默认的json初始化块，然后单击一个按钮，我想从服务器刷新它，这就是我所做的。最初，var treeData = [{title：“Dynamic Tree Demo”，isFolder ：false，工具提示：“在这里，是你的动态树！” }];

 jQuery(document).ready(function() { initReqActions(treeData); }); initReqActions= function(myTree){ $("#dynaTree").dynatree({ checkbox: false, selectMode: 2, // create IDs for HTML elements that are generated generateIds: true, cookie: { expires :-1 }, children: myTree, onQuerySelect: function(select, node) { if( node.data.isFolder ) return false; }, onSelect: function(select, node) { // Display list of selected nodes var selNodes = node.tree.getSelectedNodes(); // convert to title/key array //var selKeys = $.map(selNodes, function(node){ // return "[" + node.data.key + "]: '" + node.data.title + "'"; //}); //$("#echoSelection4").text(selKeys.join(", ")); }, onClick: function(node, event) { if( ! node.data.isFolder ) node.toggleSelect(); }, onDblClick: function(node, event) { node.toggleExpand(); }, onKeydown: function(node, event) { if( event.which == 32 ) { node.toggleSelect(); return false; } } }); } 

然后单击一个按钮

  jQuery(document).ready(function() { $("#RefreshButton").click(function() { $("#dynaTree").dynatree("option", "initAjax", { url: "refreshTree", dataType: "json" }); $("#dynaTree").dynatree("option", "children", null); $("#dynaTree").dynatree("getTree").reload(); }); });