• Register
0 votes
1.5k views

Problem :

I want to drag and drop the image on the div. The image does not get dragged onto a div and gives the below error :

Uncaught TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.draganddrop.html:20 dropdraganddrop.html:26 ondrop

 

7 5 2
3,870 points

Please log in or register to answer this question.

1 Answer

0 votes

Solution :

It has actually a very simple answer.

The function is returning the string rather than a div node. appendChild can only append the node.

So for example, if you try to do just appendChild the string:

var s = '<p>test satu dua tiga</p>'; // is the string 
document.body.appendChild(s);

This above code will never work. What will work is as below:

var s = document.createElement('p'); // is the node
s.innerHTML = 'test satu dua tiga';
document.body.appendChild(s);

 

OR

This will happen if you accidentally are not dragging a element that does have the id assigned (example you are dragging a surrounding element). In that case an ID is empty and your function drag() is assigning an empty value which is then passed to the drop() and it fails there.

So you should try assigning the ids to all of your elements, including your tds, divs, or whatever is around the draggable element.

Hope above solutions will fix your issue.

9 7 4
38,600 points

Related questions

0 votes
1 answer 11 views
11 views
Problem: I Need help; Failed to execute 'appendchild' on 'node': parameter 1 is not of type 'node'.
asked Mar 14 Wafa Abu Yousef 6.1k points
1 vote
1 answer 979 views
979 views
Problem : Trying to drag and drop an image on a div. but the image does not get dragged on to the div and gives the following error: uncaught typeerror: failed to execute 'appendchild' on 'node': parameter 1 is not of type 'node'.
asked Nov 11, 2019 peterlaw 6.9k points
0 votes
1 answer 10 views
10 views
Problem: Facing following javascript issue: failed to execute 'removechild' on 'node': the node to be removed is not a child of this node.
asked Mar 14 Wafa Abu Yousef 6.1k points
0 votes
1 answer 1.5K views
1.5K views
Problem : Facing following javascript issue failed to execute 'removechild' on 'node': the node to be removed is not a child of this node.
asked Nov 14, 2019 peterlaw 6.9k points
0 votes
0 answers 12 views
12 views
Problem: failed to execute 'replacechild' on 'node': the node to be replaced is not a child of this node
asked Feb 23 Muneeb Saadii 130k points
0 votes
1 answer 435 views
435 views
Problem : I want to save my canvas to a img. I have this function: function save() { document.getElementById("canvasimg").style.border = "2px solid"; var dataURL = canvas.toDataURL(); document.getElementById("canvasimg").src = dataURL; document. ... error: Uncaught SecurityError: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported. What should I do?
asked Nov 21, 2019 peterlaw 6.9k points
0 votes
1 answer 522 views
522 views
Problem : I am unable to solve my link problem. Can anybody help on to this to link the CSS and JS File? I am facing below error : Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:8080/RetailSmart/jsp/ ... .js Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:8080/RetailSmart/jsp/Jquery/prettify.js
asked Jan 10, 2020 alecxe 7.5k points
0 votes
1 answer 177 views
177 views
Problem : I have the javascript application and when I try to run it on firefox I am facing the below error on the console: &ldquo;Because its mime type ('text/html') is not a supported stylesheet mime type&rdquo; Now I am completely confused because of this error. Kindly somebody let me know how can I resolve my above error?
asked Jan 29, 2020 jwilliam 3.9k points
0 votes
1 answer 40 views
40 views
Problem: I would like to pass a parameter (i.e. string) to the Onclick function. At the moment I am doing this: '<input type="button" onClick="gotoNode(' + result.name + ')" />' with result.name, for example, equal to the string "Add". When I click ... works fine with a numeric parameter, I assume it has something to do with the "" characters in the string. Has anyone had this problem before?
asked Dec 1, 2020 sasha 16.2k points
0 votes
1 answer 9 views
9 views
Problem: I need to pass some values to the javascript function. And this function will perform perform also an ajax call. Plase see my code thus far: <form method="post" action="locatemembers.php" id="myform">     <label for="first_name">First Name : </label>     <input type="text" name=" ... status, error) {                 alert(request.responseText);             }         });     } </script>
asked Nov 4, 2020 robin_gallo 420 points