netik
netik

Reputation: 1836

HTML5 Drag&Drop issue in Internet Explorer (dataTransfer property access not possible)

I'm trying to implement basic drag&drop functionality with HTML5. It works totally fine in Chrome, but in IE10 I get an 0x8000ffff - JavaScript runtime error: Unexpected call to method or property access. error in the line setData.

function handleDragStart(e) {
    e.dataTransfer.effectAllowed = 'move';                                        
    e.dataTransfer.setData("dropTarget", g.destination);
}

var cols = $("#" + g.source + " tbody > tr");
[].forEach.call(cols, function (col) {
    col.addEventListener('dragstart', handleDragStart, false);
});

What am I doing wrong?

Upvotes: 25

Views: 15034

Answers (3)

Srneczek
Srneczek

Reputation: 2193

For those who are looking for an answer:

getData() and setData() attribute must be called exactly "text", since u can use any parameter in other browsers (which actualy makes lot of sense - IE rocks again), those other answers here are useless.

Upvotes: 68

lkr
lkr

Reputation: 61

You are right. In IE 11 I changed from e.dataTransfer.getData('text/html') to e.dataTransfer.getData('text') and no Errors occur. Dto. in e.dataTransfer.setData('text').

This sample (the DnD methods) will then run in IE 11, Chrome and Firefox: http://www.developer.com/lang/using-html5-drag-and-drop-in-asp.net.html

Upvotes: 6

netik
netik

Reputation: 1836

Looks like I misunderstood the purpose of dataTransfer.setData.

It works only like this:

e.dataTransfer.setData("Text", g.destination);

Upvotes: 4

Related Questions