Primeng: Touch support for DragDrop

[Zorgatone]

I'm submitting a ... (check one with "x")

• [x] bug report => Search github for a similar issue or PR before submitting
• [ ] feature request => Please check if request is not on the roadmap already https://github.com/primefaces/primeng/wiki/Roadmap
• [ ] support request => Please do not submit support request here, instead see http://forum.primefaces.org/viewforum.php?f=35

Current behavior
When trying to drag&drop on mobile (touch, hold, slide and release the finger on the screen) the page/viewport scrolls instead of dragging the html/dom element.

Expected behavior
It should drag&drop correctly how the desktop browsers do.

Minimal reproduction of the problem with instructions
You can navigate in a mobile browser to the primeNg documentation page (drag&drop section) or use the following code example on Plunkr (try to drag the small blue square onto the larger green square and it should alert message)

http://plnkr.co/edit/5BBUYLWUMikXyRaBX6bg?p=preview

What is the motivation / use case for changing the behavior?
Because all the other elements I tested worked on mobile, but drag&drop doesn't. Also it is very difficult to implement a drag&drop on mobile, so I think it's very important to give ready-to-use drag&drop element support directly in the primeNg library.

Please tell us about your environment:
Tested the drag&drop isn't working on iOS Safari, iOS Chrome and Android Chrome mobile browsers.

• Angular version: ^4.0.0

• PrimeNG version: 4.0.3

• Browser: Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView

• Language: TypeScript 2.3.4

• Node (for AoT issues): node --version = v8.1.2

[digaus]

Any progress on this?

[toketeeman]

Any more progress on this? We are in dire need to have PrimeNG drag-and-drop touch-ready.

[brennvs]

Please make it available for touch devices asap, thank you very much.

[digaus]

I think the problem is that touch devices do not support the native drag and drop implementation. Did a bit myself with manually copying the element on touch start but getting the element where you drop is difficult since you have to get it by calculating using the current position of the touch event and getting the element on that coordinate. Then you have to check if that element is wrapped by a parent element containing the droppable directive.

It is possible but hard to do.

[kenyx89]

Moving to jqTree for displaying hierarchical data.

[prashantbirajdar999]

Any Progress?

[digaus]

@atruptoneatma Switched to angular/cdk drag and drop which is far superior. It has so many more possibilities.

[prashantbirajdar999]

@digaus Thanks. I got angular/cdk drag and drop, and it is helped me.