ng-drag-drop icon indicating copy to clipboard operation
ng-drag-drop copied to clipboard

Drag and Drop within same div

Open aadeshkranderia opened this issue 7 years ago • 3 comments

I have a image tag and a paragraph tag inside a div container. Is it possible to drag and drop the image or paragraph inside the same div container. I mean I just want to move the element inside the div. Please let me know if that's possible?

aadeshkranderia avatar Apr 02 '18 21:04 aadeshkranderia

Not sure I understand how the DOM in your case is structured. You could decorate the parent div with both dragable and dropable but that would not do any good since drag drop ordering is not currently supported.

ObaidUrRehman avatar Apr 03 '18 13:04 ObaidUrRehman

This is an extension of the same question: I wanted to implement my own ordering, by dragging and dropping in the same div. The intent was to have both draggable and droppable on the element in the same div as below. I'll pass the original Position data as the drag data, and then process it on the element where it gets dropped.

`<div class="sortingContainer" *ngFor="let result of results"> <mySortableResult class="row" droppable (onDrop)="onItemDropDoSorting($event)" draggable [dragHandle]="'.drag-handle'" [dragData]="SourcePositionData"></mySortableResult>

`

However, I get the following error: 2 ERROR TypeError: _co.onItemDropDoSorting is not a function

My guess is that the (onDrop) event is mapped back to the parent (sortingContainer div) component.ts file for which the above template is associated... and NOT the custom "mySortableResult.ts" file.

Thoughts? TIA Eti

redevill avatar Jun 04 '18 23:06 redevill

Is there any plan to support drag and drop to the same div (Container) by doing drag and drop?

dhiraj3301 avatar Jul 05 '18 12:07 dhiraj3301