Pregunta

Estoy usando dynaTree de jQuery en mi solicitud y quiero seleccionar los todos los nodos secundarios mediante programación cuando se selecciona un nodo padre. La estructura de mi árbol es el siguiente

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

Ahora lo que quiero es que cuando hago clic en el nodo del árbol con el título "paquete 1" todos los nodos es decir (módulo 1.1, documento 1.1.1, 1.1.2 documento, el módulo 1.2, 1.2.1 documento, documento de su hijo 1.2 0.2) también debe ser seleccionado.

A continuación se muestra el enfoque que han tratado de usar:

$("#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);
        }


    });

En la condición if(flag) consigo todos los nodos del niño de elemento que es seleccionado por el usuario y me da el valor correcto que puedo ver de alerta (child.length) comunicado. Luego ejecutar el bucle para seleccionar todos los niños, pero no va más allá de bucle de la declaración var x = child[i].select(true);

Y nunca puedo ver el alert(i) instrucción que se está ejecutando. El resultado de la declaración anterior es que si selecciono el paquete 1, el módulo 1.1 y 1.1.1 del documento también se selecciona pero nunca se ejecuta la sentencia alert(i) - no hay otros niños de 1 paquete son seleccionados. En mi punto de vista cuando se ejecuta la declaración child[i].select(true) primera vez también desencadena la seleccione en caso de que sus niños haciendo así una especie de recursividad cosa

Es correcta mi pensamiento? No importa lo que la recursividad o lo que en la tierra lo hace, no se completa el bucle y ejecute la siguiente instrucción alert(i).

Por favor me ayude en la solución de este problema. Me muero por ver que alerta, para cualquier sugerencia y ayuda es muy apreciada.

¿Fue útil?

Solución

Apenas probó, pero se puede intentar algo como esto:

$(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;
            }
        }

Otros consejos

A pesar de ser un experto de las capacidades internas de Dynatree, me escribió un código que genera el pan rallado para el nodo se ha hecho clic y todos sus descendientes.

En el ejemplo a continuación, al hacer clic en "comestibles" haría salida:

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

mientras hace click en "manzanas verdes" seria:

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

Se puede inspirarse en este ejemplo y recuperar los campos que necesite de todos los documentos de los niños y generar el código HTML generado.

El código es en este hilo: mejor manera de generar pan rallado de texto de una matriz de PHP que tiene 3 columnas (id, ruta, nombre)?

El script PHP en si se llama desde el manejador de eventos AlActivar Dynatree través de una consulta jQuery.ajax({...});.

scroll top