У меня есть два списка элементов, которые создаются динамически, группы вопросов (слева) и вопросы (справа). Я хочу иметь возможность перетаскивать несколько вопросов из списка справа в группу вопросов слева, и эти вопросы добавляются в соответствующий список вопросов. Когда я перебираю код, кажется, что вопросы добавляются, но я считаю, что SortableJS как-то ошибается или отменяет добавление.
Проблема может заключаться в смешивании простого JS и SortableJS. Это простое событие JS имеет код appendChild, который я хочу получить:
document.addEventListener("drop", function (event, target) {
event.preventDefault();
//Element being moved.
var data = event.dataTransfer.getData("Text/html");
if (event.target.classList.contains("question-group-item") && !$(data).get(0).classList.contains("question-group-item")) {
//Blink group item being dropped into.
$(event.target).effect("highlight", { color: "#0093d2" }, 3000);
//Get group being dropped to.
var groupID = $(event.target).attr('data-group-id');
//Get all items being dropped.
sortableArray.forEach(function (questionElem) {
$(questionElem).attr('data-group-id', groupID);
document.getElementById("list-tab-" + groupID).appendChild(questionElem);
});
//Set new group ID.
//document.getElementById($(data).attr('id')).setAttribute('data-group-id', groupID);
//document.getElementById("list-tab-" + groupID).appendChild(document.getElementById($(data).attr('id')));
}
updateObjects();
});
Вот корзина JS:
https://jsbin.com/xakajusedu/edit?js,output