Question

我需要有 n 个jsTress，用户可以从一个公共树中删除项目。最初这些树可以是空的，所以当用户在其中一棵树上放置一个项目时，我需要向服务器发送一个AJAX请求以将其保存在数据库中。

为了实现n个树，我有一个循环创建<div>来保存它们，如下所示：

var DayToday = moment();
for (i = 0; i < 5; i++) {
  dayHTML += '<div class="col-md-2 column sortable"> \
                <div class="portlet portlet-sortable green-turquoise box" id="day_' + i + '_portlet"> \
                  <div class="portlet-title"> \
                    <div class="caption">' + DayToday.format('MMMM Do YYYY') + '</div> \
                    <div class="tools"> \
                      <a href="javascript:;" class="collapse"> </a> \
                      <a href="javascript:;" class="reload"> </a> \
                      <a href="javascript:;" class="remove"> </a> \
                    </div> \
                    </div> \
                    <div class="portlet-body"> \
                      <div id="day_' + i + '_tree" class="tree-demo" style="min-height:50px;"> \
                      <li></li> \
                    </div> \
                  </div> \
                </div> \
                <div class="portlet portlet-sortable-empty"> </div> \
            </div>';
  DayToday = DayToday.add(1, 'days');
}

$("#sortable_portlets").append(dayHTML);

然后添加JS树的循环：

DayToday = moment();
var currTree = [];
for (i = 0; i < 5; i++) {
  currTree[i] = $(dayTrees[i]).jstree({
      "core": {
        "id": DayToday.format('YYYY-MM-DD'),
        "animation": 150,
        'check_callback': function(operation, node, node_parent, node_position, more) {
          console.log(node_parent);
          return true; //allow all other operations
        },
        "themes": {
          "stripes": false
        },
        "data": {
          "url": "http://localhost:8888/bizsked/public/taskassignment/json?asg_date=" + DayToday.format('YYYY-MM-DD'),
          "dataType": "json"
        }
      },
      "rules": {
        droppable: ["tree-drop"],
        multiple: true,
        deletable: "all",
        draggable: "all"
      },
      "dnd": {
        open_timeout: 100
      },
      "plugins": ["dnd"]

    })
    .on("move_node.jstree", function(e, data) {
      console.log(data);
    })
    .on("copy_node.jstree", function(e, data) {
      console.log(data);
    });
  DayToday = DayToday.add(1, 'days');
}

实际上，您可以从每棵树拖放到另一棵树。但我似乎无法理解的是我如何获得已被删除的树的ID或一些id。好吧，所以我可以很容易地找到被拖动的项目，如果它被放到一个子节点（不是主节点）上，那么我可以找到该ID，但是如果它被放到一个空树或主节点上（＃），我找不到ID，只有＆＃39;＃＆＃39;。也许我遗漏了一些基本的东西，但我需要知道的是（a）被丢弃的项目的ID（简单）和（b）被丢弃的树的ID ...（不是那么容易）。 / p>

关于我如何做到这一点的任何建议都会非常感激，因为我一直试图解决这个问题两天了！

Answer 1

尝试探索data事件中的move_node对象。你应该在某处有一个instance属性。那是树。

jsTree拖放多个树

1 个答案: