SortableJS multi drag не работает при использовании appendChild - PullRequest
0 голосов
/ 24 октября 2019

У меня есть два списка элементов, которые создаются динамически, группы вопросов (слева) и вопросы (справа). Я хочу иметь возможность перетаскивать несколько вопросов из списка справа в группу вопросов слева, и эти вопросы добавляются в соответствующий список вопросов. Когда я перебираю код, кажется, что вопросы добавляются, но я считаю, что 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

...