dynatree - 如何在拖放后保存动态树结构

Question

我不知道如何在将节点拖放到新的动态树后保存它。

我有 2 个动态树，我正在从一个动态树拖动到另一个动态树，但我不知道是否可以获得新树的结构信息。 我的第一棵树:

$("#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结构？ 提前致谢

Answer 1

你可以使用这样的东西:

  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 源

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

我不确定我是否解释得足够好 - 如果不是就在这里回复。

希望它能帮助您或其他人。