Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Drag Drop CDK: keep showing dragged element inside starting list

I'm playing with cdk Drag and Drop cause I need it to create a POC for work. I started with this code from the documentation website. I saw that every time I drag an element outside its list, said element is hidden until I drop it in the same list or in another one.

So tell me if I'm wrong, but it seems that the dragged element is not a copy of the list item, but instead it's the element itself.

In conclusion I want the list to not change its layout while I'm dragging one of its elements.

Long story short:

CURRENT BEHAVIOUR enter image description here

EXPECTED BEHAVIOR enter image description here

I didn't found anything to do this in the cdk documentation.

like image 408
Federico Galfione Avatar asked Apr 19 '19 09:04

Federico Galfione


Video Answer


1 Answers

In your stackblitz change in cdk-drag-drop-connected-sorting-example.css

change

.cdk-drag-placeholder {
  opacity: 0;
}

into: (or just remove it)

.cdk-drag-placeholder {
  /* opacity: 0; */
}

the fact its disappearing is due to css styling of the placeholder.


If you want to disable Sorting. Have a look HERE!

like image 195
Andre Elrico Avatar answered Sep 18 '22 14:09

Andre Elrico