как сохранить структуру dynatree после перетаскивания - PullRequest
2 голосов
/ 13 марта 2012

Я не могу понять, как сохранить новое дерево после перетаскивания на него узла.

У меня есть 2 dynatree, и я тащусь от одного к другому, но я не знаю, смогу ли я получить информацию о структуре нового дерева. мое первое дерево:

$("#tree1").dynatree({

                title: "tree",
                children: [{ title: "tree1", isFolder: true}],
                dnd: {
                    onDragStart: function (node) {

                        logMsg("tree.onDragStart(%o)", node);
                        return true;
                    },
                    onDrop: function (node, sourceNode, hitMode, ui, draggable) {

                        logMsg("tree.onDrop(%o, %o, %s)", node, sourceNode, hitMode);
                        sourceNode.move(node, hitMode);
                    }
                }


            });

и второй:

$("#Tree2").dynatree({
                title: "Tree",

                children: [{ title: "MyTree", isFolder: true}],


                isLazy: true,

                dnd: {
                    onDragStart: function (node) {

                        logMsg("tree.onDragStart(%o)", node);
                        return true;
                    },
                    onDrop: function (node, sourceNode, hitMode, ui, draggable) {

                        logMsg("tree.onDrop(%o, %o, %s)", node, sourceNode, hitMode);
                        sourceNode.move(node, hitMode);
                    },
                    onDragEnter: function (node, sourceNode) {

                        logMsg("tree.onDragEnter(%o, %o)", node, sourceNode);
                        return true;
                    },
                    onDragOver: function (node, sourceNode, hitMode) {

                        logMsg("tree.onDragOver(%o, %o, %o)", node, sourceNode, hitMode);
                    },

                    onDragLeave: function (node, sourceNode) {

                        logMsg("tree.onDragLeave(%o, %o)", node, sourceNode);
                    },
                    onDrop: function (node, sourceNode, hitMode, ui, draggable) {

                        logMsg("tree.onDrop(%o, %o)", node, sourceNode);
                        var copynode;
                        var rootNode = $("#OrganizationTree").dynatree("getRoot");
                        if (sourceNode && (node.data.title === 'Organization' || node !== rootNode)) {
                            copynode = sourceNode.toDict(true, function (dict) {
                                dict.title = dict.title;
                                dict.key = sourceNode.data.key;
                                node.data.isFolder = true;

                            });
                        } else {
                            alert(" please drop your node into the organization");
                        }
                        if (hitMode == "over") {
                            // Append as child node
                            node.addChild(copynode);
                            sourceNode.remove();       
                        }
                    }
                }

            });

как сохранить структуру tree2? заранее спасибо

Ответы [ 2 ]

4 голосов
/ 10 апреля 2012

Вы можете использовать что-то вроде этого:

  dnd: {
          onDrop: function(node, sourceNode, hitMode, ui, draggable) {
            /** This function MUST be defined to enable dropping of items on
             *  the tree.
             */
            sourceNode.move(node, hitMode);
            var currentTree = $("#tree").dynatree("getTree").toDict();
            $.post("forajax.php", { recieved: currentTree},
               function(data) {
                 $("#output").html(data);
             });
          }
        }

И источник forajax.php

<?
function noFalseMulti($var) 
/*
*This function will remove from array key containing 'false' of 'null'  (empty keys)
*
*I have realized, if there are this data it shows error-I don't know why
*/
  {
  $var=array_filter($var, 'noFalse');
  foreach($var as $key => $value)
    {
    if(is_array($var[$key]))
      {
      $var[$key]=noFalseMulti($var[$key]);
      }
    }
  return $var;
  }

$dataToSave=serialize(noFalseMulti($_POST['recieved']));
?>

Вы сохраняете данные, где хотите.И когда они вам понадобятся снова, используйте это:

$("#tree").dynatree({
        initAjax: {url: "createTree.php",
                   data: {//key: "root", 
                          // Optional arguments to append to the url
                          //mode: "all"
                          }
                   },

Ant createTree.php source

<?
$yourSavedData=''; //place here the data you have saved before
$array=unserialize($yourSavedData);
echo json_encode($array);
?>

Я не уверен, объяснил ли я это достаточно хорошо- если не просто ответьте здесь.

Надеюсь, это поможет вам или кому-то еще.

0 голосов
/ 11 июня 2014

Просто используйте функцию toDict ().

Из документации:

// Get a JavaScript object copy of the tree
var dict = $("#tree").dynatree("getTree").toDict();
// ... then use Ajax to send this to your server...
...