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 - 如何動態創建節點

回答

相關問題