Stack Overflow
Stack Overflow

Questions tagged [angular-cdk-drag-drop]

168 questions
1
vote
1 answer

How to update position of Angular cdkDropList?

I have this issue for quite some time and can't figure it out and wanted to ask if it's possible to help. Somehow the position of the 'drop area' of the cdkDropList does not update when I animate it. What I want to do Create a cdkDropList
…
Pedestrian
  • 23
  • 3
1
vote
1 answer

Radio input selection resets when using angular material drag and drop

I'm trying to use the angular material drag and drop component to reorder a list of basic radio inputs. When the page loads, the correct radio input is checked. My problem is that, when I reorder the checked item in the list using the [Grab] handle,…
Aaron
  • 271
  • 2
  • 11
1
vote
2 answers

Save order on page refresh of cdkDrag, cdkDropList Angular Material

Intro I have a To Do List which leverages Angular Material's cdkDrag directive on elements inside of a cdkDropList. Marking items as 'to-do' or 'done' and vice versa is straightforward. Problem There's a level of detail in the user interaction,…
markreyes
  • 1,249
  • 1
  • 13
  • 27
1
vote
0 answers

Angular CDK/drag-drop allow underlying controll and scroll of element

Moving a img with cdk drag-drop works totally fine. But if the div I want to drag is scrollable, the cdk drag is prioritized, resulting in a non-scrollable div. Important: MOBILE! - Scroll with PC (scroll wheel) is working.
Seba M
  • 99
  • 1
  • 8
1
vote
1 answer

cdkDragPreview and cdkDragPlaceholder not working as expected with horizontal elements

I'm using display-inline in my elements as I want them to lay out horizontally instead of vertically as they do in most of the Angular examples. That said, the CSS behaves very weird. I'm specifically having two issues. When I click an element…
Kristopher Bishop
  • 15
  • 1
  • 5
1
vote
0 answers

How can I assign a function to cdkDragData and then call that function as a callback while dragging?

My drag has been implemented in a separate component and drop in another component.While dragging, I call [cdkDropListEnterPredicate]="isDropPossible" and I have to use a callback inside this "isDropPossible" function. This callback function will be…
Avinash Singh
  • 11
  • 2
1
vote
0 answers

Angular 8- Autoscroll while dragging an element using cdkDrag and cdk-virtual-scroll

I have a long list of elements which have to be dragged and dropped. Which is working if the elements are in the viewport. The page does not scroll if i have to drag further down or up. I am using the CdkVirtualScrollViewport for scrolling and…
dev_101
  • 321
  • 4
  • 14
1
vote
1 answer

Drop an image in a specific region

I have an image gallery and I intend to drag and drop these images into a drop zone. I tried to use it in two cases (using the mouse to drag the image and using the cdk drag & drop that allows me to move the image to the drops area as well). Is…
Harry
  • 621
  • 3
  • 9
  • 21
1
vote
1 answer

ngClass behaving differently than regular classes with cdk-drag-drop

EDIT 2: The issue has been fixed by the amazing CDK Team! EDIT: As this seems to be quite strange behaviour, I have for now added an issue in the official CDK repository. Feel free to suggest any ideas or workourounds, however. I have different…
imatpot
  • 11
  • 3
0
votes
0 answers

In cdk drag and drop I don't want to change the height of the box

I have two lists one is for tasks and on the other side I have list to those I can assign. When I drag and drop the task to the next section it changes the height of the row which I don't want to change. Any helpful answer is appreciated. I did read…
Mugheex Masud
  • 1
0
votes
0 answers

@angular/cdk drag and dop not working after import

I have a project using angular 10 and Bootstrap. I want to use the drag and drop feature offered by cdk without material. I imported the lib npm i @angular/cdk@9 I added in my root app.modules the lib import {DragDropModule} from…
Teddy Kossoko
  • 1,168
  • 3
  • 20
  • 48
0
votes
1 answer

How to position tooltip based on dragged element positions?

I have a simple drag element example from angular documentation, in which I have a button that can be dragged around in the container, and the button has a tooltip.
The Dead Man
  • 6,258
  • 28
  • 111
  • 193
0
votes
0 answers

Restricting movement within an element

I am trying to restrict movement within an element using https://material.angular.io/cdk/drag-drop/overview . The example unfortunately does not work for my project and I can move the example out of the borders.
…
Katerina Maria Gerakianaki
  • 7
  • 3
0
votes
0 answers

Angular CDK Drag and drop functionality not working when media items are in a flexbox layout

I'm trying to implement drag and drop functionality for a list of media items in my Angular application. The drag and drop feature works fine when the media items are displayed in a vertical list format, but I'm encountering issues when I try to…
RAHUL KUNDU
  • 561
  • 2
  • 10
  • 26
0
votes
1 answer

Angular CDK: How to create a drag and drop list with parent and child elements

I'm trying to implement a drag and drop list in Angular using the Angular CDK. The list should have parent and child elements, and I want to enable the ability to drag and drop both parent items and their child items. Additionally, I need to allow…
tyler
  • 418
  • 4
  • 14
1 2 3
…
11 12