www.webdeveloper.com
Results 1 to 2 of 2

Thread: Seeing the folowing error and need help!

  1. #1
    Join Date
    Feb 2013
    Posts
    1

    Seeing the folowing error and need help!

    Hello, i am new to javascript and trying use drag and drop but seeing the following error :

    NS_ERROR_INVALID_POINTER: Component returned failure code: 0x80004003 (NS_ERROR_INVALID_POINTER) [nsIDOMHTMLDivElement.appendChild]
    http://localhost:5723/dominoes/index.php
    Line 26

    plus, i can put up the image but it still has a copy left behind and wont let me drop it..

    Code:
     [Break On This Error] 	
    
    ev.target.appendChild(document.getElementById(data));
    
     ev.dataTransfer.setData("Text",ev.target.id);
    }
    function drop(ev) {
    ev.preventDefault();
    var data=ev.dataTransfer.getData("Text");
    ev.target.appendChild(document.getElementById(data));
    }
    </script>
    </head>
    This the htmlt output

    Code:
    <!doctype html>
    <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
      <head>
        <meta charset="utf-8" />
        <title></title>
    		<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" />
    		<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
    		<script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>
    		<link rel="stylesheet" href="/resources/demos/style.css" />
    		<link rel="stylesheet" href="../dominoes/css/dominoes.css" type="text/css" />
    	<!--[if IE]>
    		<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    	<![endif]-->
        <script>
        function allowDrop(ev) {
            ev.preventDefault();
        }
    
        function drag(ev){
            ev.dataTransfer.setData("Text",ev.target.id);
        }
    
        function drop(ev)        {
            ev.preventDefault();
            var data=ev.dataTransfer.getData("Text");
            ev.target.appendChild(document.getElementById(data));
        }
        </script>
      </head>
      <body> 
    		
    
    <div id="board" ><div id='playArea' ondrop='drop(event)' ondragover='allowDrop(event)'><div id="Play2Right" ><div style="background-color: black;" class="bones_Play2Right">42</div><div style="background-color: black;" class="bones_Play2Right">44</div><div style="background-color: black;" class="bones_Play2Right">32</div><div style="background-color: black;" class="bones_Play2Right">65</div><div style="background-color: black;" class="bones_Play2Right">55</div><div style="background-color: black;" class="bones_Play2Right">0</div><div style="background-color: black;" class="bones_Play2Right">50</div></div><div id="Play2Top" ><div style="background-color: blue;" class="bones_Play2Top">53</div><div style="background-color: blue;" class="bones_Play2Top">51</div><div style="background-color: blue;" class="bones_Play2Top">61</div><div style="background-color: blue;" class="bones_Play2Top">11</div><div style="background-color: blue;" class="bones_Play2Top">60</div><div style="background-color: blue;" class="bones_Play2Top">62</div><div style="background-color: blue;" class="bones_Play2Top">31</div></div><div id="Play2Left" ><div style="background-color: red;" class="bones_Play2Left">43</div><div style="background-color: red;" class="bones_Play2Left">33</div><div style="background-color: red;" class="bones_Play2Left">30</div><div style="background-color: red;" class="bones_Play2Left">41</div><div style="background-color: red;" class="bones_Play2Left">22</div><div style="background-color: red;" class="bones_Play2Left">64</div><div style="background-color: red;" class="bones_Play2Left">63</div></div><div id="Play2Active" ><img draggable="true" ondragstart="drag(event)" class="bones_Play2Active" src="/dominoes/css/images/66.png" alt="66" ><img draggable="true" ondragstart="drag(event)" class="bones_Play2Active" src="/dominoes/css/images/40.png" alt="40" ><img draggable="true" ondragstart="drag(event)" class="bones_Play2Active" src="/dominoes/css/images/10.png" alt="10" ><img draggable="true" ondragstart="drag(event)" class="bones_Play2Active" src="/dominoes/css/images/52.png" alt="52" ><img draggable="true" ondragstart="drag(event)" class="bones_Play2Active" src="/dominoes/css/images/20.png" alt="20" ><img draggable="true" ondragstart="drag(event)" class="bones_Play2Active" src="/dominoes/css/images/54.png" alt="54" ><img draggable="true" ondragstart="drag(event)" class="bones_Play2Active" src="/dominoes/css/images/21.png" alt="21" ></div></div></div>
    
      </body>
    </html>

  2. #2
    Join Date
    Mar 2007
    Location
    U.K.
    Posts
    1,127
    If you wrote that code then you can't be that new to JavaScript.
    It would be easy to spoon-feed you the answer, but you need to learn to debug, which means checking that what you think is happenng, is happening. The easiest method to explain is to use the alert() function to display the value of variables in a failing function, which is all I did to find the immediate problem.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles