0

Hello I'm trying to drag an object between two ui-router ui-view elements

one ui-view element is the main 'canvas' and the other element is a right hand pane that had some or tags.

I got the objects draggable using angular-drag drop. However, when I try to drag things to the left onto the canvas? It ends up going behind the main canvas instead of on top of them.

I tried adjusting the z-index even trying it with !important but it di did not help to show the dragged object when I drag it into the canvas.

The following image shows what I mean when I drag the image halfway into the canvas. It gets hidden behind the canvas div.

enter image description here

Any advice on how I can correct this?

ThinkBonobo
  • 15,487
  • 9
  • 65
  • 80

1 Answers1

0

I discovered that my bug could be solved as follows.

I added the jquery ui options:

{
  helper: 'clone', // creates a new object.
  appendTo: 'body' // assigns new object to be a child of a selector
}

You can't just use appendTo as the JQ UI docs will tell you. You need the helper.

ThinkBonobo
  • 15,487
  • 9
  • 65
  • 80