jsTree определяет перемещение между деревьями и изменяет идентификатор скопированного узла
Я пытаюсь использовать jsTree для создания 2 деревьев, основанных на родительских и дочерних отношениях. Для этого я использую следующий скрипт:
$(function () {
loadTree($('#jstree_indexed_container'), document.getElementById('hiddenFieldIndexedData').value);
loadTree($('#jstree_nonindexed_container'), document.getElementById('hiddenFieldNonIndexedData').value);
});
function loadTree(jsTreeContainer, stringData) {
jsTreeContainer.jstree({
"core": {
"animation": 0,
"check_callback": true,
"themes": { "stripes": true },
'data': JSON.parse(stringData)
},
"plugins": ["contextmenu", "dnd", "search", "wholerow", "unique"]
});
jsTreeContainer.on("move_node.jstree", function (e, data) {
notifyServerOfChange(data, false);
});
jsTreeContainer.on("copy_node.jstree", function (e, data) {
notifyServerOfChange(data, true);
});
}
function notifyServerOfChange(data, isCopy) {
var oldParent = getNodeById(data.old_instance, data.old_parent);
var newParent = getNodeById(data.new_instance, data.parent);
alert(sprintf("%s node %s from %s to %s. It now has ID: %s", (isCopy ? "Copied" : "Moved"), (data.original != null ? data.original.id : data.node.id), getNodeTitle(oldParent), getNodeTitle(newParent), data.node.id));
}
function getNodeById(jsTreeContainer, id) {
return jsTreeContainer.element.find("[id='" + id + "']");
}
function getNodeTitle(node) {
return node.find('a').first().text();
}
Однако при перемещении узла между двумя деревьями всегда вызывается событие copy_node.jstree, даже если я перемещаю узел. Если я перемещаю узел в том же дереве, я получаю правильное событие "move_node.jstree".
Вопрос 1: Есть ли способ правильно определить, был ли узел перемещен, а не скопирован, между двумя деревьями?
Вопрос 2: Идентификаторы моего узла вычисляются на основе отношения родитель-потомок, поэтому после копирования / перемещения узла я заново вычисляю это отношение и хочу использовать его для замены предыдущего идентификатора узла. Если я пытаюсь изменить data.node.id в методе notifyServerOfChange, узел больше не может быть выбран впоследствии.
Спасибо
1 ответ
Если вы перемещаете узлы между деревьями с помощью drag n drop (как это происходит из используемых вами плагинов), вы можете слушать dnd_stop.vakata
событие и проверьте, если ctrl
ключ нажимается так:
$(document).on('dnd_stop.vakata', function (e, data) {
if (data.event.ctrlKey) {
console.log('copy');
} else {
console.log('move');
}
});
Проверьте скрипку: JS Fiddle