Wie kann ich untergeordneten Knoten programmatisch auszuwählen, in dynatree?

Question

Ich bin mit jQuery dynaTree in meiner Anwendung, und ich möchte alle die untergeordneten Knoten programmatisch auszuwählen, wenn ein übergeordneter Knoten ausgewählt wird. Die Struktur meines Baumes ist wie folgt

<div id = "tree">
    <ul>
       <li>package 1
         <ul>
           <li>module 1.1
              <ul>
                <li> document 1.1.1</li>
                <li> document 1.1.2</li>
               </ul>
            </li>  
            <li>module 1.2
               <ul>
                 <li>document 1.2.1</li>
                 <li>document 1.2.2</li>
               </ul>
           </li>
        </ul>
     </li>
     <li> package 2
        <ul>
          <li> module 2.1
            <ul>
               <li>document 2.1.1</li>
               <li>document 2.1.1</li>
            </ul>
          </li>
        </ul>
      </li>
    </ul>
</div> 

Nun, was ich will, ist, dass wenn ich auf Baumknoten mit dem Titel „Paket 1“ alle seine untergeordneten Knoten dh (Modul 1.1, Dokument 1.1.1 Dokument 1.1.2, Modul 1.2, Dokument 1.2.1 Dokument 1.2 0,2) sollte ebenfalls ausgewählt werden.

Im Folgenden ist der Ansatz, den ich zu verwenden versucht haben:

$("#tree").dynatree({
        onSelect: function(flag, dtnode) {
            // This will happen each time a check box is selected/deselected
            var selectedNodes = dtnode.tree.getSelectedNodes();
            var selectedKeys = $.map(selectedNodes, function(node) {

                //alert(node.data.key);
                return node.data.key;


            });
            // Set the hidden input field's value to the selected items
            $('#SelectedItems').val(selectedKeys.join(","));

            if (flag) {
                child = dtnode.childList;

                alert(child.length);
                for (i = 0; i < child.length; i++) {
                    var x = child[i].select(true);
                    alert(i);
                 }
            }
        },
        checkbox: true,
        onActivate: function(dtnode) {
            //alert("You activated " + dtnode.data.key);
        }


    });

Im if(flag) Zustand erhalte ich alle die untergeordneten Knoten des Elements, die durch den Benutzer ausgewählt wird, und es gibt mir den richtigen Wert, dass ich von alert (child.length) Erklärung sehen. Dann laufe ich die Schleife alle, die Kinder zu wählen, aber Schleife geht nie über die Aussage var x = child[i].select(true);

Und ich kann nie die Anweisung alert(i) sehen ausgeführt wird. Das Ergebnis der obigen Aussage ist, dass wenn ich Paket auswählen 1, Modul 1.1 und 1.1.1 Dokument auch ausgewählt, aber es führt nie die alert(i) Aussage - keine weiteren Kinder der Verpackung 1 ausgewählt sind. Aus meiner Sicht, wenn erstmals child[i].select(true) Anweisung ausgeführt wird es löst auch die bei der Auswahl der Veranstaltung ihrer Kinder so eine Rekursion Art der Sache zu machen

Ist mein Denken richtig? Egal, was Rekursion oder was auf der Erde es tut, ist es nicht die Schleife abzuschließen und führen Sie den nächsten Befehl alert(i).

Bitte helfen Sie mir, dieses Problem zu lösen. Ich sterbe, dass die Warnung zu sehen, jede Anregung und Hilfe wird sehr geschätzt.

Answer 1

kaum getestet, aber man kann so etwas wie dies versucht:

$(function(){
    var inEventHandler = false;
    $("#tree").dynatree({
        checkbox: true,
        selectMode: 2,
        [...]
        onSelect: function(select, dtnode) {
            // Ignore, if this is a recursive call
            if(inEventHandler) 
                return;
            // Select all children of currently selected node
            try {
                inEventHandler = true;
                dtnode.visit(function(childNode){
                    childNode.select(true);
                });
            } finally {
                inEventHandler = false;
            }
        }

Answer 2

Obwohl sein kein Experte von Dynatree internen Kapazitäten, schrieb ich einige Code, Semmelbrösel für die klickten Knoten und alle seine Nachkommen erzeugt.

Im Beispiel unten, klicken Sie auf "Esswaren" ausgeben würde:

edibles
edibles > fruits
edibles > fruits > apples
edibles > fruits > apples > green apples
edibles > fruits > apples > green apples > granny smith
edible > vegetables
edible > vegetables > potatoes

, während Sie auf "grünen Äpfeln" ausgeben würde:

edibles > fruits > apples > green apples
edibles > fruits > apples > green apples > granny smith

Sie können Inspiration aus diesem Beispiel ziehen und rufen Sie die Felder, die Sie von allen Kindern Dokumente benötigen und Ihre HTML-Ausgabe erzeugen.

Der Code ist in diesem Thread:

Verwenden Sie die folgende Funktion anstelle des einen von Mar10 der Antwort.

Alle untergeordneten Knoten werden ausgewählt / nicht ausgewählt auf Elternknoten wählen / abzuwählen.

onSelect: function (isSelected, node) {
    node.visit(function (childNode) {
        childNode.select(isSelected);
    });
},

Answer 3

Answer 4

Answer 5

Answer 6

Answer 7

Verwenden Sie die folgende Funktion anstelle des einen von