CODEWITHSUNDEEP
javascripthtmlinternet-explorerdrag-and-drop
Mark
Mark

Reputation: 833

HTML 5 & Javascript Drag and drop on IE

I am trying to get Drag and Drop using only Javascript and HTML 5 on IE 9 and 8 (or at least IE 9) but it wont work and I have read drag and drop should work on IE. Can you have a look at my code and help me out to get this to work with IE?

Code: 

<script type="text/javascript">
function allowDrop(ev){
    ev.preventDefault();
}

function drag(ev){
    var drag = ev.dataTransfer.setData("content", ev.target.id);

}

function drop(ev){
    ev.preventDefault();
    var image= ev.dataTransfer.getData("content");
    if ( image == ev.target.id) {
        ev.target.appendChild(document.getElementById(image));

    }

    else {

    }
}
</script>
<section id="planetBox">
<img class="planetImage" id="mercuryImg" draggable="true" 
    ondragstart="drag(event)" alt="A Planet" src="./images/planets/mercury.gif">  
</section>  

<div class="planet">
<section class="venusBox" id="venusImg" ondrop="drop(event)" 
    ondragover="allowDrop(event)"></section>
<section class="planetName"><h3>Venus</h3></section>    
</div>

Upvotes: 0

Views: 670

Answers (1)

Deprecated Darren
Deprecated Darren

Reputation: 895

try changing

var drag = ev.dataTransfer.setData("content", ev.target.id);
var image= ev.dataTransfer.getData("content");

to 

var drag = ev.dataTransfer.setData("Text", ev.target.id);
var image= ev.dataTransfer.getData("Text");

and you might look at removing that if condition

if ( image == ev.target.id) {

Upvotes: 1

Related Questions