Does Eikon Web App container support HTML5 Drag and Drop?

I'm using Eikon Web SDK and trying to follow the example from http://www.w3schools.com/html/tryit.asp?filename=tryhtml5_draganddrop.

However, when I published my application to Production, it seems like chromium in Eikon doesn't support this feature.

Please confirm whether I am correct or not.

//HTML

Drag the W3Schools image into the rectangle:

//Javascript
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));
}

Find more posts tagged with

html

eikon

refinitiv-internal

Accepted answers

Jirapongse

I think it is because JET also uses Drag and Drop to pass data to another Eikon Desktop object. For more information, please refer to JET.js API Demo App in Eikon. The Drag & Drop sample is in CORE FUNCTIONALITY topic.

To make the example from http://www.w3schools.com/html/tryit.asp?filename=tryhtml5_draganddrop work, I have modified it, as shown below. I call JET.dragStart() and transfer the data via a global variable.

**HTML**

<!DOCTYPE HTML>

Drag and Drop

#div1 {width:350px;height:70px;padding:10px;border:1px solid #aaaaaa;}

Drag the W3Schools image into the rectangle:

----------

**JavaScript**

var draggedTarget;
window.onload = function () {
JET.onLoad(initApp);
JET.init({
ID: "JETSample"
});
}

function initApp() {
console.log("Jet is init");

var div1 = document.getElementById("div1");
div1.ondragenter = function (e) {
e.preventDefault();
console.log("Div enter");

};

div1.ondragover = function (ev) {
ev.preventDefault();
console.log("Div Over");
}

div1.ondrop = function (ev) {
ev.preventDefault();
console.log("Ondrop");
ev.target.appendChild(document.getElementById(draggedTarget));
}

var img = document.getElementById("drag1");
img.ondragstart = function (ev) {

draggedTarget = ev.target.id;
var data = {
entities: [{
datasource: "",
"RIC": ""
}]
};
JET.dragStart(data);
};
}

All comments

Jirapongse

Drag the W3Schools image into the rectangle:

EXPLORE OUR SITES