jQuery DynaTree - como criar dinamicamente os nós

Question

Eu tenho um aplicativo web (JSPs e Servlets, juntamente com jQuery) que eu estou usando um DynaTree para mostrar um conjunto de arquivos encontrados usando uma pesquisa de usuário. O utilizador pode, claro, colocar em valores diferentes, resultando em um conjunto diferente de arquivos correspondentes.

Então, meu Q:

Tendo em conta que uma árvore é estaticamente codificados desta forma no meu JavaScript do JSP:

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

Como faço para criar esta estrutura de programação? Presumo alguma maneira de criar ou acessar uma raiz e use addChild (ânodo) ou algo assim, mas eu não encontrar um bom exemplo / referência.

Alguém já fez isso? Obrigado!

Answer 1

tenho que trabalhar. Aqui está o 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
            });
        });         
       ...

Aqui está o JSON na resposta (use Firebug> Net> XHR para vê-lo):

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"]

Answer 2

Eu fiz isso com Yii2, usando objeto JSON. Eu costumava initAjax opção que é usado para inicializar a estrutura de árvore:

<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>

E função de gravação no servidor que gera um objeto 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);
}

Referência

Answer 3

O atributo children sobre o plugin dynatree é uma estrutura simples JSON. Difícil de responder à sua pergunta, sem mais informações. Mas você pode criar esses dados JSON em serverside antes de exibir o HTML gerado ou você pode chamar algo usando ajax para voltar esses dados JSON.

Existem várias maneiras de gerar que, dependendo do que você quer.

Se isso não ajudá-lo a compreender que, forneça informações mais explícito quando você quer criar dinamicamente os nós.