jQuery DynaTree - 如何动态创建节点

我有一个Web应用程序（JSP和Servlet以及jQuery），我使用DynaTree来显示使用用户搜索找到的一组文件。用户当然可以输入不同的值，从而生成一组不同的匹配文件。jQuery DynaTree - 如何动态创建节点

所以，我问：

由于树是静态在我的JSP的JavaScript编码正是如此：

$("#tree").dynatree({ 
    ... 
    children: [ 
    {title: "Folder 2", isFolder: true, key: "folder2", 
     children: [ 
     {title: "Sub-item 2.1"}, 
     {title: "Sub-item 2.2"} 
     ] 
    }, 
    {title: "Item 3"} 
    ] 
...

如何编程创建这个结构呢？我假设一些方法来创建或访问一个根，然后使用addChild（aNode）或其他一些方法，但我没有找到一个很好的示例/参考。

有没有人这样做？谢谢！

来源

2012-01-11 Mark

得到它的工作。这里是jQuery的：

$('#findFiles').click(function() { // Locate HTML DOM element with ID "findFiless" and assign the following function to its "click" event... 
    chosenSite = document.getElementById("siteName").value; 
    searchVal = document.getElementById("searchFor").value; 
    searchTyp = document.getElementById("searchType").value; 
    $.get('FileSearchServlet', {siteName: chosenSite, searchFor: searchVal, searchType: searchTyp}, function(responseJson) { // Execute Ajax GET request on URL of "FileSearchServlet" and execute the following function with Ajax response JSON... 
     //-- toClient 
     var resultsToClientNode = $("#tree").dynatree("getTree").selectKey("resultsToClient"); 
     resultsToClientNode.removeChildren(); 
     toClientFilenames = responseJson.toClient; //0-N filenames 
     $.each(responseJson.toClient, function() { 
      resultsToClientNode.addChild({ 
       title: this 
      }); 
     });   
     ...

这里的JSON的响应（使用Firebug>网络> XHR看到它）：

fromClient 
["O_TE015308_XX_343_182754070041.OLD", "O_TE015308_XX_343_182755030040.OLD", "O_TE015308_XX_353_131142014034.OLD"] 

toLab 
[] 

fromLab 
[] 

toClient 
["R_TE015308_XX_340_154659.OLD"]

来源

2012-01-18 15:13:24 Mark

dynatree插件上的children属性是一个简单的jSon结构。如果没有更多信息，很难回答你的问题。但是，您可以在显示生成的html之前在服务器端创建此jSon数据，或者您可以使用ajax来调用某些内容来获取此jSon数据。

有几种方法来生成，取决于你想要什么。

如果这不能帮助您理解这一点，请在您想要动态创建节点时提供更多明确的信息。

来源

2012-01-11 21:24:34 dknaack

感谢。以下是该场景，我很乐意根据需要进行更改： 1-显示搜索JSP页面。用户输入搜索值。 2-一个servlet进行一些处理，包括决定需要显示的树值。然后转发到另一个显示结果的JSP，包括树。如果这会更好，我很乐意使用Ajax。关于这将如何工作的详细的帮助将是伟大的。谢谢！ – Mark 2012-01-12 13:44:11

我做到了与Yii2，使用JSON对象。我用它是用来初始化树结构initAjax选项：服务器

<div id="tree"></div> 

<script> 
$("#tree").dynatree({ 
    initAjax: {url: global+"companyAdmin/roles-master/get-department-and-menus",}, 
    checkbox: true,  // Show checkboxes. 
    icon:false, 
    selectMode: 3,   //3:multi-hier    
}); 
</script>

而写函数生成一个JSON对象：

public function actionGetDepartmentAndMenus() { 
    $responseData = array(); 
    $responseData['title']='ABC'; 
    $responseData['id']=1; 
    $responseData['expand']=true; 
    $responseData['children']['title']='ABC'; 
    $responseData['children']['id']=1; 
    $responseData['children']['expand']=true; 
    echo json_encode($responseData); 
}

Reference

来源

2017-08-28 13:31:20

jQuery DynaTree - 如何动态创建节点

回答

相关问题