B. Kemmer B. Kemmer - 1 year ago 96
jQuery Question

OpenUI5 Drag & Drop from and into a Tree

i am trying to Drag & Drop Items from an OpenUI5-Tree into another Tree.


The User should be able to choose a TreeItem and Drop it into the Middle of the Screen (into another Tree). In that Tree the User should be able to sort the choosen Items per Drag & Drop.

My Problem is that i can only Drag things, but i can't drop them into the Tree. I made the Tree droppable, but it doesn't work.

Here you have a little Example:

JsBin Example

I am trying to drag and drop items into the right Table.

I am using Google Chrome version 41. Unfortunately i can't drag items with Firefox. I don't know why...

Answer Source

After about 3 hours, i got the solution.
Here you have a sample:
JS-Bin Solution

I had to use jquery events like that:

$("#" + sap.ui.getCore().byId("middleTree").getId()).on("drop", function(event) {

$("#" + sap.ui.getCore().byId("middleTree").getId()).on("dragover", function(event) {

$("#" + sap.ui.getCore().byId("middleTree").getId()).on("dragleave", function(event) {

While it is better to use SAP/OPEN UI5s method attachBrowserEvent i can't actually use it with a Tree, because it doesn't extend Control sap.ui.core.Control.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download