JStree: отслеживание перетаскивания в дереве - PullRequest
Новая
       8

JStree: отслеживание перетаскивания в дереве

4 голосов
/ 31 декабря 2011

Я (пытаюсь) использовать JStree для дерева категорий / подкатегорий.Это заняло довольно много времени, но мне удалось создать дерево с данными JSON, которые я извлекаю из базы данных (используя PHP для запросов и построения объектов JSON).

Теперь я хотел бы иметь возможность отслеживатьперетащить действия.То есть: подкатегория x из главной категории a перетаскивается в главную категорию b.Мне нужно записать это, чтобы изменить базу данных после действия.Я подумал, что мне понадобятся функции check_move или drop_finish.drop-finish вообще не работает, событие не инициируется.Похоже, это связано с тем, что мои узлы не имеют класса jstree-drop, но я не могу правильно установить класс: он не будет работать.

Функция check_move будет продолжать срабатывать при передаче другихподкатегории и поэтому создает загрузку нежелательных данных.

Мои (тестовые) данные JSON: 

[
{
    "metadata": {
        "id": "1"
    },
    "data": "Geluid",
    "children": [
        {
            "data": "Speakers",
            "attr": {
                "href": ""
            },
            "metadata": {
                "id": "1"
            }
        },
        {
            "data": "Versterkers",
            "attr": {
                "href": ""
            },
            "metadata": {
                "id": "3"
            }
        }
    ]
},
{
    "metadata": {
        "id": "2"
    },
    "data": "Licht",
    "children": [
        {
            "data": "Parren",
            "attr": {
                "href": ""
            },
            "metadata": {
                "id": "2"
            }
        }
    ]
}
]

Мой код JStree: 

$(function () {
  $("#Create").click(function () {
    $("#tree").jstree("create");
    });     
  $("#Rename").click(function () {
    $("#tree").jstree("rename");
  });
  $("#Remove").click(function () {
    $("#tree").jstree("remove");
    });


    $("#tree").jstree({
        "dnd" : {
          "drop_finish" : function (data) {
         alert ("Drag OK");
          //alert("Dragged: " + data.o.attr('id') + " to " + data.r.attr('id'));         
        }
      },
      "themes" : {
            "theme" : "classic",
            "dots" : true,
            "icons" : false
        },
      "json_data" : {
            "ajax" : {
                "url" : "get_category_tree.php"
            }
        },
        "plugins" : [ "themes", "json_data", "ui", "crrm", "checkbox", "dnd" ]
    })
    .bind("select_node.jstree", function (e, data) {
      var req = new ZaxasRequest();
      req.getContent("category_content.php?id=" + data.rslt.obj.data('id') +"", "category_content");
    })
});

В принципе, я хотел бычтобы получить удостоверения личности.Не беспокойтесь о том, что идентификатор основной и подкатегории может быть одинаковым, я исправлю эту проблему позже;) Кто-нибудь может указать мне правильное направление?

1 Ответ

0 голосов
/ 19 сентября 2012

Привязать к событию перемещения и использовать плагин CRRM ... Выложу пример кода позже .. JSTree CRRM

...