Question: How to make dragged-item appear overtop all other items?

[harvanchik]

I tried setting the z-index, but the dragged-item is underneath other items in the grid.

[harvanchik]

Anyone know a solution to this?

[bpugh]

I believe the default behavior is for the dragged item to appear above the others, but you might want to try playing with the multilayer functionality: https://tiberiuzuld.github.io/angular-gridster2/multiLayer

[harvanchik]

I believe the default behavior is for the dragged item to appear above the others, but you might want to try playing with the multilayer functionality: https://tiberiuzuld.github.io/angular-gridster2/multiLayer

No, this is not the case. You can see in this demo. Turn off Push Items and drag the first item over another. You can see that the blue trash icon is not covered up; however, if you drag another item over the first one, it does cover the blue trash icon.

[verygreenboi]

@harvanchik Did you find a solution for this?

[harvanchik]

@harvanchik Did you find a solution for this?

Unfortunately, I did not.

[ovska]

You can work around this with the handlers in draggable.

draggable: {
  enabled: true,
  start: (_, gridsterItemComponent) => {
    gridsterItemComponent.el.style.zIndex = '2';
  },
  stop: (_, gridsterItemComponent) => {
    gridsterItemComponent.el.style.zIndex = '1';
  },
},