Problem drag and drop javascript

3

I have the following error:

    ordenes:296 Uncaught TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.
 at HTMLDivElement.<anonymous> (ordenes:296)

I'm bringing information from a server

var elements = [];
var html = '';
function loadlink(){
  url='<?=  site_url("ordenes/getdatos")?>', 
  $.ajax({
    type: 'get',
    url: url, 
    beforeSend: function () {

    },
      success: function(result){



        var parsedJSON = JSON.parse(result);
        //console.log('Elemento '+elements.length);
        //console.log('Arreglo '+parsedJSON.length);


        if(parsedJSON.length != elements.length){
          elements = [];
          $('#space_1').append('');
          for (var i=0;i<parsedJSON.length;i++) {
              //orders.shift(parsedJSON[i].idorder)
              //console.log(parsedJSON[i].idorder);
              elements.push(parsedJSON[i].idorder);
              html = '<div class="task card alert" draggable="true" id="task'+parsedJSON[i].idorder+'">';
              html += '<h3 class="title text-primary">#'+parsedJSON[i].idorder+'</h3>';
              html += '<p>Manuel Morales';
              html += '<br>00:00 pm';
              html += '</p>';
              html += '</div>';
              $('#space_1').append(html);
          }
        }
    }
  });

shows me the elements correctly

My problem starts when I drag and drop to another div:

var dropTarget = document.querySelector(".wrapper");
var draggables = document.querySelectorAll(".task");

for(let i = 0; i < draggables.length; i++) {
  draggables[i].addEventListener("dragstart", function (ev) {
     ev.dataTransfer.setData("srcId", ev.target.id);
     //console.log(ev.target.parentNode.id);
     //console.log(ev.target.id); 
  });
}

dropTarget.addEventListener('dragover', function(ev) {
  ev.preventDefault();
});

dropTarget.addEventListener('drop', function(ev) {
  ev.preventDefault();
  let target = ev.target;
  let droppable  = target.classList.contains('box');
  let srcId = ev.dataTransfer.getData("srcId");

  if (droppable) {
    ev.target.appendChild(document.getElementById(srcId));
  }
});

Someone knows what the following error is:

ordenes:296 Uncaught TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.
    at HTMLDivElement.<anonymous>

line of the problem:

ev.target.appendChild(document.getElementById(srcId));
    
asked by DoubleM 28.05.2018 в 01:34
source

0 answers